I am starting multiple npm tasks in parallel (using &, not just in sequence &&). Thus in package.json:
"start": "npm run watch-blog & npm run watch-data & npm run server",
And those sub-tasks are useful stuff to me like:
"watch-blog" : "watchy -w _posts/**/* -- touch _pages/blog.md",
Question: How can I all shut down all three tasks together?
I noticed CTRL–C is only killing the last. (my
watch-blog survives and keeps „touching“)
Closing the terminal window doesn't help. Only killall node does the job, but that's killing more than I would like to…
Killing detached processes (that's the word…) will be a pain. One will have to look at pids, and more stuff coming your way. Not to mention cross-platform issues, if meant to work under windows...
Easier and working:
npm install concurrently --save
and thus
"start": "concurrently \"npm run watch-blog\" \"npm run watch-data\" \"npm run serve\"",
Tested (under Ubuntu 16.04, npm 5.6).
Related
Currently I have this script in my package.json file:
"npm run build:main:dev && concurrently -k -n Main,Rend -c yellow,cyan \"electron --inspect=5858 --ignore-certificate-errors ./build --watch\" \"npm run build:renderer:watch\""
I would like to add something to it, so that it will completely finish running npm run build:main:dev before it goes on to run the rest of the script. How can I do that?
I have the following npm scripts:
"build:server:dev": "webpack --config ./webpack.server.dev.config.js --watch",
"build:client:dev": "webpack --config ./webpack.client.dev.config.js --watch",
"build:server:prod": "webpack --config ./webpack.server.prod.config.js",
"build:client:prod": "webpack --config ./webpack.client.prod.config.js",
"start:server:prod": "export NODE_ENV=production && node ./dist/server.*.js",
"start:iso:dev": "export NODE_ENV=development && npm run build:client:dev & npm run build:server:dev",
"start:iso:dev:win": "set NODE_ENV=development && concurrently --kill-others \"npm run build:client:dev\" \"npm run build:server:dev\"",
"start:iso:prod": "npm run build:client:prod && npm run build:server:prod && npm run start:server:prod"
The problem I'm facing is that the server compilation depends on the client compilation (I generate an html template where I inject the scripts with webpack on the client, and I use this template for server rendering in the server script).
In nearly all of the cases, the client finishes compiling before the server, but while running these scripts concurrently, there is no way to ensure that this will always be true.
When running webpack watch mode, it is not possible to run these scripts in sequence, as watch mode will block the second script from running.
The most obvious solution in my mind is to compile them without watch mode once, and then attach watch mode on the fly after the initial compilation.
I'm not sure how to achieve this though, and I would not like to compile them twice, just for the sake of attaching watch mode.
The second alternative I have in mind is to fiddle with webpack progress plugin, and somehow compile the server script after the client script has finished.
I dislike this solution, because I don't want to hard couple one script to another.
So is there a way to run client and server compilation sequentially from an npm script while using webpack --watch mode?
Maybe this will help you parallel-webpack although I didn't try it it has watch mode and would probably just require connecting your configs for both server and client side someway along this way:
// some script for running parallel builds
module.exports = [
require('./webpack.server.dev.config.js'),
require('./webpack.client.dev.config.js'),
];
then check running in watch mode
I found a nice solution using the npm package wait-on:
https://github.com/jeffbski/wait-on
The npm script I used (Unix & Windows):
"start:iso:dev": "export NODE_ENV=development && npm run clean:build && npm run build:client:dev & wait-on public/build/index-dev.html && npm run build:server:dev --inspect",
"start:iso:dev:win": "npm run clean:build:win && set NODE_ENV=development&& concurrently \"npm run build:client:dev\" \"wait-on public\\build\\index-dev.html && npm run build:server:dev\"",
This works like a charm.
Hi is there a way i can keep webpack devserver running even after closing terminal.
"scripts": {
"dev-server": "npm run templates && webpack-dev-server -d --https --port 28443",
}
when i run npm run dev-server it starts but after closing terminal webpack devserver also closes is there any way to keep it running with pm2 or any other method.
use nohup
So if the script command is "dev-server" (according to your snippet), then go to your project root directory (where the package.json file is, which has your "scripts" section):
If on unix environment, just run nohup npm run dev-server &
If on windows, install git bash - it's sort of a mini unix environment for windows. And then run the nohup npm run dev-server &
This will start the webpack dev server and keep it running on the background
For me, my script section is
"scripts": {
"dev": "webpack-dev-server --open"
}
and the above command that I mentioned works fine
nohup did somehow not work for me, but i was able to make it work with forever.
sudo npm install -g forever
forever start -c "webpack serve" ./
I have these 2 commands in my npm scripts
"scripts": {
"webpack": "webpack --config webpack.config.js --watch",
"server": "nodemon server.js",
}
As you can see, one runs webpack every time I save a file and one just runs the server with nodemon so I don't have to type "npm start" or something of the sorts every time I save a file.
Now this works fine but I need 2 terminals always open to run it and it gets a little crowded on my screen.
And I can't have one command read like this:
"start": "npm run webpack && npm run server"
becase the webpack command is ongoing and will never reach the second command.
Is there a way to have these two commands in 1 terminal, is this even advisable?
You could run one process in the background with & (one ampersand, not two) but that would require you to manage it manually, which would be rather tedious. For details see What does ampersand mean at the end of a shell script line?.
For that use-case someone built concurrently, which makes it simple to run processes in parallel and keep track of their output.
npm install --save-dev concurrently
And your start script becomes:
"start": "concurrently 'npm run webpack' 'npm run server'"
If you want to make the output a little prettier you can give the processes names with -n and colours with -c, for example:
"start": "concurrently -n 'webpack,server' -c 'bgBlue.bold,bgGreen.bold' 'npm run webpack' 'npm run server'"
Its easy actually, use & instead of && if you don't want to wait for the first one to finish. By adding & to the end of a command, you tell to execute in the background.
Simple example
npm run webpack & npm run server
Advanced example:
I run 2 watchers (1 is a vue app, the second is a scss/js theme folder) in 1 window in 2 different folders actually. So a combination of double && and single &
(cd ~/some-path && yarn encore dev --watch) & (cd ~/some-other-path/ && yarn run dev)
The output of both watchers is mixed but is no problem actually. Only readability will decrease.
One downside is that when you hit ctrl-c to stop the processes like you used to do, it only closes the currently running non-background task. The first is running in background because it was followed by &.
So if you want to stop both processes, just close the terminal window and both will be finished.
Or hit ctrl-c to stop the open process
followed by following command to:
kill the last background process:
kill %1
OR
kill the last command
kill $!
For someone who is coming from PHP background the process of killing node and starting it again after every code change, seems very tedious. Is there any flag when starting a script with node to automatically restart node when code change is saved?
A good option is Node-supervisor:
npm install supervisor -g
and after migrating to the root of your application use the following
supervisor app.js
You should look at something like nodemon.
Nodemon will watch the files in the directory in which nodemon was started, and if they change, it will automatically restart your node application.
Example:
nodemon ./server.js localhost 8080
or simply
nodemon server
forever module has a concept of multiple node.js servers, and can start, restart, stop and list currently running servers. It can also watch for changing files and restart node as needed.
Install it if you don't have it already:
npm install forever -g
After installing it, call the forever command: use the -w flag to watch file for changes:
forever -w ./my-script.js
In addition, you can watch directory and ignore patterns:
forever --watch --watchDirectory ./path/to/dir --watchIgnore *.log ./start/file
Various NPM packages are available to make this task easy.
For Development
nodemon: most popular and actively maintained
forever: second-most popular
node-dev: actively maintained (as of Oct 2020)
supervisor: no longer maintained
For Production (with extended functionality such as clustering, remote deploy etc.)
pm2: npm install -g pm2
Strong Loop Process Manager: npm install -g strongloop
Comparison between Forever, pm2 and StrongLoop can be found on StrongLoop's website.
You can also try nodemon
To Install Nodemon
npm install -g nodemon
To use Nodemon
Normally we start node program like:
node server.js
But here you have to do like:
nodemon server.js
node-dev
node-dev is great alternative to both nodemon and supervisor for developers who like to get growl (or libnotify) notifications on their desktop whenever the server restarts or when there is an error or change occur in file.
Installation:
npm install -g node-dev
Use node-dev, instead of node:
node-dev app.js
Notification on Changing file so server start automatically
console out put
Follow the steps:
npm install --save-dev nodemon
Add the following two lines to "script" section of package.json:
"start": "node ./bin/www",
"devstart": "nodemon ./bin/www"
as shown below:
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node ./bin/www",
"devstart": "nodemon ./bin/www"
}
npm run devstart
https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/skeleton_website
I use runjs like:
runjs example.js
The package is called just run
npm install -g run
Nodejs supports watching mode since v18.11.0. To run it just pass --watch argument:
node --watch ./index.js
Note: this is an experimental feature.