From 482b499fec063afe5db338c2bd4fcde93f2526af Mon Sep 17 00:00:00 2001 From: Chord Date: Tue, 12 May 2020 23:48:34 +0200 Subject: [PATCH] Use concurrently for dev work --- README.md | 76 ++++++++++-------- package-lock.json | 192 ++++++++++++++++++++++++++++++++++++++++++++++ package.json | 4 +- 3 files changed, 237 insertions(+), 35 deletions(-) diff --git a/README.md b/README.md index 5c79105..b921eec 100644 --- a/README.md +++ b/README.md @@ -62,6 +62,7 @@ Before running, you will need to create a `.env` file in the root of the project PGUSER=your_database_user PGHOST=localhost PGPASSWORD=your_database_user_password +PSADMIN="127.0.0.1:51002" PGDATABASE=psforever PGPORT=5432 COOKIE_SECRET=make_this_very_long_and_random @@ -69,15 +70,53 @@ COOKIE_SECRET=make_this_very_long_and_random **Never** share/release/commit your `.env` file. -Run the following commands: +Now run the following command: ``` -# Will start the backend server (:8080) -npm run dev-server +# Will start the backend server (:8080) and webpack +npm run dev ``` You should see similar output: ``` +> psfportal@1.0.0 dev /home/chord/PSFPortal +> concurrently --kill-others "npm run dev-server" "npm run webpack" + +[1] +[1] > psfportal@1.0.0 webpack /home/chord/PSFPortal +[1] > webpack-dev-server --history-api-fallback --config webpack.config.cjs --content-base public +[1] +[0] +[0] > psfportal@1.0.0 dev-server /home/chord/PSFPortal +[0] > nodemon -w api/ -w index.js +[0] +[0] [nodemon] 2.0.2 +[0] [nodemon] to restart at any time, enter `rs` +[0] [nodemon] watching dir(s): api/**/* index.js +[0] [nodemon] watching extensions: js,mjs,json +[0] [nodemon] starting `node index.js` +[0] (node:16193) ExperimentalWarning: The ESM module loader is experimental. +[0] WARNING: development server simulated delay active +[0] Trusting proxy +[0] Connected to the psql database at localhost +[0] Starting PSAdmin polling for 127.0.0.1:51002 +[0] [MODE development] PSFWeb now accepting requests at http://localhost:8080/ +[1] ℹ ｢wds｣: Project is running at http://dev.psforever.net:8081/ +[1] ℹ ｢wds｣: webpack output is served from / +[1] ℹ ｢wds｣: Content not from webpack is served from /home/chord/PSFPortal/public +[1] ℹ ｢wds｣: 404s will fallback to /index.html +[1] ℹ ｢wdm｣: Hash: 72b56958125b6abdf96c +[1] Version: webpack 4.41.5 +[1] Time: 4493ms +[1] Built at: 05/12/2020 11:44:23 PM +[1] Asset Size Chunks Chunk Names +[1] bundle.js 2.1 MiB bundle [emitted] bundle +[1] bundle.js.map 2.23 MiB bundle [emitted] [dev] bundle +[1] Entrypoint bundle = bundle.js bundle.js.map +[1] [1] multi (webpack)-dev-server/client?http://dev.psforever.net:8081 ./app/main.js 40 bytes {bundle} [built] +[1] [./app/App.svelte] 14.5 KiB {bundle} [built] + +[1] ℹ ｢wdm｣: Compiled successfully. > psfportal@1.0.0 dev-server > nodemon -w api/ -w index.js @@ -92,37 +131,6 @@ Connected to the psql database at localhost [MODE development] PSFWeb now accepting requests at http://localhost:8080/ ``` -Finally run in another terminal: - -``` -# Will start the frontend Webpack builder with hot reload (:8081) -npm run dev -``` - -You should see similar output: -``` -> psfportal@1.0.0 dev /home/username/PSFPortal -> webpack-dev-server --history-api-fallback --config webpack.config.cjs --content-base public - -ℹ ｢wds｣: Project is running at http://localhost:8081/ -ℹ ｢wds｣: webpack output is served from / -ℹ ｢wds｣: Content not from webpack is served from /home/username/PSFPortal/public -ℹ ｢wds｣: 404s will fallback to /index.html -ℹ ｢wdm｣: Hash: 7936960d2ecba7f25c89 -Version: webpack 4.41.5 -Time: 4075ms -Built at: 01/07/2020 6:47:43 PM - Asset Size Chunks Chunk Names - bundle.js 2.09 MiB bundle [emitted] bundle -bundle.js.map 2.22 MiB bundle [emitted] [dev] bundle -Entrypoint bundle = bundle.js bundle.js.map -[1] multi (webpack)-dev-server/client?http://localhost:8081 ./app/main.js 40 bytes {bundle} [built] -[./app/App.svelte] 14.5 KiB {bundle} [built] - - + 218 hidden modules -ℹ ｢wdm｣: Compiled successfully. -``` - Please note that Webpack (dev) will proxy all API requests (/api) to the host `http://localhost:8080` (see the `devServer` key in [webpack.config.cjs](webpack.config.cjs)). This MUST match your backend server's (dev-server) listening port, which is by default 8080. **Finally, connect to http://localhost:8081** (webpack, not the raw express server) diff --git a/package-lock.json b/package-lock.json index c393534..ce54752 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1371,6 +1371,94 @@ "typedarray": "^0.0.6" } }, + "concurrently": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/concurrently/-/concurrently-5.2.0.tgz", + "integrity": "sha512-XxcDbQ4/43d6CxR7+iV8IZXhur4KbmEJk1CetVMUqCy34z9l0DkszbY+/9wvmSnToTej0SYomc2WSRH+L0zVJw==", + "dev": true, + "requires": { + "chalk": "^2.4.2", + "date-fns": "^2.0.1", + "lodash": "^4.17.15", + "read-pkg": "^4.0.1", + "rxjs": "^6.5.2", + "spawn-command": "^0.0.2-1", + "supports-color": "^6.1.0", + "tree-kill": "^1.2.2", + "yargs": "^13.3.0" + }, + "dependencies": { + "ansi-regex": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz", + "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==", + "dev": true + }, + "is-fullwidth-code-point": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz", + "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=", + "dev": true + }, + "string-width": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz", + "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==", + "dev": true, + "requires": { + "emoji-regex": "^7.0.1", + "is-fullwidth-code-point": "^2.0.0", + "strip-ansi": "^5.1.0" + } + }, + "strip-ansi": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz", + "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==", + "dev": true, + "requires": { + "ansi-regex": "^4.1.0" + } + }, + "supports-color": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz", + "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==", + "dev": true, + "requires": { + "has-flag": "^3.0.0" + } + }, + "yargs": { + "version": "13.3.2", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz", + "integrity": "sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==", + "dev": true, + "requires": { + "cliui": "^5.0.0", + "find-up": "^3.0.0", + "get-caller-file": "^2.0.1", + "require-directory": "^2.1.1", + "require-main-filename": "^2.0.0", + "set-blocking": "^2.0.0", + "string-width": "^3.0.0", + "which-module": "^2.0.0", + "y18n": "^4.0.0", + "yargs-parser": "^13.1.2" + } + }, + "yargs-parser": { + "version": "13.1.2", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz", + "integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==", + "dev": true, + "requires": { + "camelcase": "^5.0.0", + "decamelize": "^1.2.0" + } + } + } + }, "configstore": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.2.tgz", @@ -1660,6 +1748,12 @@ "integrity": "sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=", "dev": true }, + "date-fns": { + "version": "2.13.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.13.0.tgz", + "integrity": "sha512-xm0c61mevGF7f0XpCGtDTGpzEFC/1fpLXHbmFpxZZQJuvByIK2ozm6cSYuU+nxFYOPh2EuCfzUwlTEFwKG+h5w==", + "dev": true + }, "debug": { "version": "3.2.6", "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz", @@ -3179,6 +3273,12 @@ "parse-passwd": "^1.0.0" } }, + "hosted-git-info": { + "version": "2.8.8", + "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.8.tgz", + "integrity": "sha512-f/wzC2QaWBs7t9IYqB4T3sR1xviIViXJRJTWBlx2Gf3g0Xi5vI7Yy4koXQ1c9OYDGHN9sBy1DQ2AB8fqZBWhUg==", + "dev": true + }, "hpack.js": { "version": "2.1.6", "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz", @@ -4587,6 +4687,18 @@ "osenv": "^0.1.4" } }, + "normalize-package-data": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz", + "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==", + "dev": true, + "requires": { + "hosted-git-info": "^2.1.4", + "resolve": "^1.10.0", + "semver": "2 || 3 || 4 || 5", + "validate-npm-package-license": "^3.0.1" + } + }, "normalize-path": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", @@ -5090,6 +5202,12 @@ "integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A=", "dev": true }, + "path-parse": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz", + "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==", + "dev": true + }, "path-to-regexp": { "version": "0.1.7", "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz", @@ -6164,6 +6282,17 @@ } } }, + "read-pkg": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-4.0.1.tgz", + "integrity": "sha1-ljYlN48+HE1IyFhytabsfV0JMjc=", + "dev": true, + "requires": { + "normalize-package-data": "^2.3.2", + "parse-json": "^4.0.0", + "pify": "^3.0.0" + } + }, "readable-stream": { "version": "2.3.6", "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", @@ -6274,6 +6403,15 @@ "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=", "dev": true }, + "resolve": { + "version": "1.17.0", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.17.0.tgz", + "integrity": "sha512-ic+7JYiV8Vi2yzQGFWOkiZD5Z9z7O2Zhm9XMaTxdJExKasieFCr+yXZ/WmXsckHiKl12ar0y6XiXDx3m4RHn1w==", + "dev": true, + "requires": { + "path-parse": "^1.0.6" + } + }, "resolve-cwd": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-2.0.0.tgz", @@ -7019,6 +7157,44 @@ "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM=", "dev": true }, + "spawn-command": { + "version": "0.0.2-1", + "resolved": "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2-1.tgz", + "integrity": "sha1-YvXpRmmBwbeW3Fkpk34RycaSG9A=", + "dev": true + }, + "spdx-correct": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.1.0.tgz", + "integrity": "sha512-lr2EZCctC2BNR7j7WzJ2FpDznxky1sjfxvvYEyzxNyb6lZXHODmEoJeFu4JupYlkfha1KZpJyoqiJ7pgA1qq8Q==", + "dev": true, + "requires": { + "spdx-expression-parse": "^3.0.0", + "spdx-license-ids": "^3.0.0" + } + }, + "spdx-exceptions": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz", + "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A==", + "dev": true + }, + "spdx-expression-parse": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz", + "integrity": "sha512-Yg6D3XpRD4kkOmTpdgbUiEJFKghJH03fiC1OPll5h/0sO6neh2jqRDVHOQ4o/LMea0tgCkbMgea5ip/e+MkWyg==", + "dev": true, + "requires": { + "spdx-exceptions": "^2.1.0", + "spdx-license-ids": "^3.0.0" + } + }, + "spdx-license-ids": { + "version": "3.0.5", + "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.5.tgz", + "integrity": "sha512-J+FWzZoynJEXGphVIS+XEh3kFSjZX/1i9gFBaWQcB+/tmpe2qUsSBABpcxqxnAxFdiUFEgAX1bjYGQvIZmoz9Q==", + "dev": true + }, "spdy": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/spdy/-/spdy-4.0.1.tgz", @@ -7518,6 +7694,12 @@ } } }, + "tree-kill": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz", + "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==", + "dev": true + }, "tslib": { "version": "1.10.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz", @@ -7841,6 +8023,16 @@ "integrity": "sha512-CNmdbwQMBjwr9Gsmohvm0pbL954tJrNzf6gWL3K+QMQf00PF7ERGrEiLgjuU3mKreLC2MeGhUsNV9ybTbLgd3w==", "dev": true }, + "validate-npm-package-license": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz", + "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==", + "dev": true, + "requires": { + "spdx-correct": "^3.0.0", + "spdx-expression-parse": "^3.0.0" + } + }, "vary": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz", diff --git a/package.json b/package.json index dbdb9b1..8f9ea9c 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,8 @@ "main": "index.js", "scripts": { "build": "cross-env NODE_ENV=production webpack --config webpack.config.cjs", - "dev": "webpack-dev-server --history-api-fallback --config webpack.config.cjs --content-base public", + "dev": "concurrently --kill-others \"npm run dev-server\" \"npm run webpack\"", + "webpack": "webpack-dev-server --history-api-fallback --config webpack.config.cjs --content-base public", "prod-server": "cross-env NODE_ENV=production node index.js", "dev-server": "nodemon -w api/ -w index.js", "production": "npm run build && npm run prod-server" @@ -37,6 +38,7 @@ "autoprefixer": "^9.7.3", "axios": "^0.19.0", "bootstrap": "^4.4.1", + "concurrently": "^5.2.0", "cross-env": "^5.2.0", "css-loader": "^2.1.1", "eslint": "^6.8.0",