Concurrently does not modify NODE_ENV variable - node.js

So I'm working on a project using webpack and wanted to create a script on my package.json to run both dev and production mode from there. I'm a windows user and always use Concurrently to run multiple terminal tasks at the same time.
I set my package.json scripts like this:
"scripts": {
"start": "concurrently \"set NODE_ENV=\" \"webpack --watch\"",
"build": "concurrently \"set NODE_ENV=production\" \"webpack\""
},
The output of this in the terminal is:
set NODE_ENV= exited with code 0
Webpack is watching the files…
...
So basically webpack is working properly, but the variable is not being created/deleted. Both commands are failing.
If I run directly
set NODE_ENV=production
it works, so I'm a bit confused...
Any ideas?
Thanks a lot!

Change:
"start": "concurrently \"set NODE_ENV=\" \"webpack --watch\"",
"build": "concurrently \"set NODE_ENV=production\" \"webpack\""
to:
"start": "NODE_ENV= webpack --watch",
"build": "NODE_ENV=production webpack"
You cannot change the environment in one process and expect it to be changed in another started in parallel. You can only change the env of child processes and only on their startup. Child process always inherits the environment from the parent.
If the above doesn't work on Windows then use cross-env:
npm install --save-dev cross-env
and in package.json use:
"start": "cross-env NODE_ENV= webpack --watch",
"build": "cross-env NODE_ENV=production webpack"

Related

How do i run one script on development and another on production

"scripts": {
"start": "$env:NODE_ENV=\"development\"; nodemon server.js",
"start:prod": "$env:NODE_ENV=\"production\"; nodemon server.js"
},
I want to set the NODE_ENV variable to development when i run 'start' script and to production when i run 'start:prod' script but i get error that says:
$env:NODE__ENV="development"; nodemon server.js
The filename, directory name, or volume label syntax is incorrect.

npm start json-server in background

I'm trying to have my npm start script run json-server in the background in parallel to then running react-scripts to start UI. How would I go about doing this? I've tried various things with single & and prestart, etc but everything results in json-server starting to watch my db file but then react-scripts doesn't run.
The main 2 which I thought should do the trick are below, but neither work.
"scripts": {
"prestart" : "json-server --watch ../sample-db.json --port 3010 --delay 800&",
"start": "set HTTPS=true&&react-scripts start",
and
"scripts": {
"start": "json-server --watch ../sample-db.json --port 3010 --delay 800&set HTTPS=true&&react-scripts start",
Not quite a duplicate, but as indicated by #Max this has a few options:
How can I run multiple npm scripts in parallel?
So here's one way:
"scripts": {
"start": "set HTTPS=true&&react-scripts start",
"mockserver": "json-server --watch ../sample-db.json --port 3010 --delay 800",
"startdev": "concurrently --kill-others \"npm start\" \"npm run mockserver\"",
}
And I see that on windows I need to use "start" which was why single ampersand wasn't working.

Use of pm2 with npm run

I havea react frontendapp for which I defined a number of build and run tasks in package.json as shown in the following snippet:
"scripts": {
"start": "env-cmd -f .env.dev react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"build:dev": "env-cmd -f .env.dev npm run build",
"build:test": "env-cmd -f .env.test npm run build",
"build:prep": "env-cmd -f .env.prep npm run build",
"build:prod": "env-cmd -f .env.prod npm run build",
"start-dev-server": "env-cmd -f .env.dev node server/server.js",
"start-test-server": "env-cmd -f .env.test node server/server.js",
"start-prep-server": "env-cmd -f .env.prep node server/server.js",
"start-server": "env-cmd -f .env.prod node server/server.js"
},
My goal is to run the app by using the pm2 tool based on a run configuration which should execute "npm run start-server". This execution should internaly run the last line in the above snippet which is "env-cmd -f .env.prod node server/server.js"
I wrote a pm2 config file, namely my_config.json, for to realizing above sketched scenario as follows:
my_config.json:
{
"apps": [
{
"name": "ReactFrontEndApp",
"script": "npm",
"args": "run start-server"
}
]
}
Finally, I issue the following command in the command console:
pm2 start my_config.json
When above pm2 command is issued my application is listed under pm2 list command output. Nevertheless, the pm2 tool also starts popping up command-consoles one after another without an end (the previos one fades away and then the next one appears). I tested my application at https://localhost:3000 in the browser meanwhile but the browser does not bring anything my app at all (i.e. not found). As a consequence, I have to stop my application by using pm2 stop command.
QUESTION: Is there something I might be missing in the my_config.json file, which might be causing this successive command console opennings? What could be wrong?
I guess that your server fail to load somehow, maybe pm2 change relevant environment variables.
what is the output of pm2 logs 0? what happened when you run npm run start-server manually? what happened when run pm2 start npm -- run start-server manually?

nodemon in npm script triggered multiple times

My npm scripts:
"build": "tsc -w -p ./src/server",
"run": "nodemon --watch ./dist/server ./dist/server/app.js",
"start": "concurrently --kill-others \"npm:build\" \"npm:run\""
From VSCode's terminal I can start the app using the start task.
But nodemon starts twice, and restarts multiple times when a file is saved. I assumed it's because the build task hasn't completed yet.
How can I make these work in series, so the one waits for the other? I do not want to use polling.
I'm using Ubuntu 18, node 10.15.0, npm 6.5.0.
Example of my configuration which works well:
package.json:
"start:dev": "nodemon --config nodemon.json ./dist/src/index.js",
nodemon.json:
{
"watch": ["src"],
"ext": "ts",
"ignore": ["src/**/*.spec.ts"],
"exec": "ts-node ./src/index.ts"
}

Electron and webpack build with task

I am building an application with:
React 16.4.0
Electron 2.0.2
Webpack 4.11.0
webpack-dev-server 3.1.4
This application uses hot-reload (as far as that is currently working...) for development. Every time I want to start my project I have to start 2 tasks right after eachother and it is getting annoying. There has to be a faster way. Is there any way I can start them with 1 node task and they startup after each other?
I must note that the dev server must be done with compiling before the electron app can be started.
package.json
"main": "main.js",
"scripts": {
"build": "webpack-dev-server --config webpack.dev.js --hot",
"start": "SET NODE_ENV=development&& electron ."
},
I've done something like this on a recent project using concurrently.
$ npm i -SD concurrently
And then in your package.json
"scripts": {
"dev-server": "webpack-dev-server --config webpack.dev.js --hot",
"electron-dev": "SET NODE_ENV=development && electron .",
"start": "concurrently --kill-others --names \"webpack,electron\" \"npm run dev-server\" \"npm run electron-dev\""
},
This does not, unfortunately, wait for the bundle to finish. But I find I can just hit reload (Ctrl/Cmd + R) once in the Electron app after the build finishes and I'm good to go.

Resources