Run script after node server starts - javascript

We have an application that has the following three scripts inside package.json...
"start": "concurrently --kill-others \"npm run start-electron\" \"npm run start-webpack\" -n \"electron,webpack\" -p name",
"start-electron": "electron -r babel-register ./js-file",
"start-webpack": "node -r babel-register scripts/js-file-2.js"
When we run npm start, both start-electron and start-webpack scripts are called. We are using Concurrently to run both scripts at the same time.
There is a major issue. When we start the Webpack script, it makes a HTTP request to the Node server. Because these two scripts are running concurrently, we can't guarantee the Node server will be running when we run the Webpack script.
Here's my question. How can I run the Webpack script as soon as the Node server starts and avoid this race condition?

Do they really need to run next to each other? Any chance that you could create a node program that launches electron, and either checks if it's running or waits a certain amount of time before running the webpack command?
As an idea you could implement something like this:
Create a nodejs program that reads an argument that has the server target address,
start electron and create head request to the given url,
once it's running, launch webpack.
I guess both commands stay alive (webpack is probably watching files, electron manages the server).
You could check into integrations between electron and webpack, for example, this one

Related

How to chain npm script call after each ng serve build?

I'm trying to chain the ng serve script call while running but when I've ran this command the second chained script build-components.js runs only on first call.
I thought concurrently package here would allow both scripts to run in sequence according to docs https://www.npmjs.com/package/concurrently
What I'm aiming to do is run the build-components.js script every time ng serve runs (i.e, detects a source change).
Package.json script:
"build:watch": "concurrently \"ng serve --port 4003\" \"node build-components.js\""
Testing
concurrently "ng serve --port 4003" "node build-components.js"
[1] node build-components.js exited with code 0
[0] i 「wds」: Project is running at http://localhost:4003/webpack-dev-server/
Question:
How can you run another npm script after each ng serve build?
I've also had a look at the npm post hooks but this doesn't seem to run the script after ng serve has ran either.
http://www.marcusoft.net/2015/08/pre-and-post-hooks-for-npm-scripting.html#hooks-pre-and-post
This is the build-components.js script for reference. It copies some extra build files to a public folder for hosting:
const fs = require('fs-extra');
const concat = require('concat');
(async function build() {
const js = [
'./dist/app/runtime-es2015.js',
'./dist/app/main-es2015.js',
'./dist/app/scripts.js',
];
const css = ['./dist/app/styles.css'];
await fs.ensureDir('components');
await concat(js, 'components/component.js');
await concat(css, 'components/component.css');
})();
This is not possible. ng serve does not complete when run in watch mode so chaining items to run after it will have no effect. The serve command has no hooks for this.

Start client and server in one command using Vue-cli / Webpack

I am deploying a Vue client using Vue-cli 3, which uses Webpack
(I can start the client by calling "yarn dev --open")
I am also writing a server with an API for the client
(I can start the server by calling "node server/server.js")
Is there a way to start both the client and the server with one command?
I was thinking that I should add some code to vue.config.js to start the server before the client is being compiled.
Preferably this would all work in a hot-reload way.
So far I tried a shell script as Alex78191 suggested:
#!/usr/bin/env bash
node server/server.js &
yarn dev --open
This works, but when I try to stop the servers using ctrl-C, only the yarn-process stops, but the node server keeps on running.
Is there a way in bash to stop all started processes (background and foreground) with the ctrl-C command?
I was able to get this working with the following bash script:
#!/usr/bin/env bash
node server/server.js &
pid=$!
yarn dev --open
trap "kill ${pid}; exit 1" INT
This script is a little bit more complex than you might expect to make sure that all child processes stop when this script stops (using ctrl-C). For more information on stopping child processes I found some help here: how-can-bash-script-do-the-equivalent-of-ctrl-c-to-a-background-task

Setting up intellij debugger to be able to break inside or step thru an NPM script

I have an NPM script that runs and ultimately generates a file in the repo.
How do I go about configuring the debugger to run it so that I am able to do such things as break inside/step thru its code after I run it on the command line.
If you like to start your script in command line and not from the IDE, you need using NodeJS Remote Debug run configuration:
modify your NPM script to make sure that your Node.js app is run with debugger, like:
"scripts": {
"start": "node --debug-brk=5858 build/app.js"
}
create NodeJS Remote Debug run configuration, specify 5858 as a Port there
run npm start in console, start the debugger in the IDE

What is difference between node and nodemon?

in my package.json I am using
"scripts": {
"start": "node app.js"
},
but if I use nodemon replace with node app.js like
"scripts": {
"start": "nodemon app.js"
},
then what will happen? Because when I got any error at server side, other API also close working. So I think it happen because I use node app.js if I use nodemon app.js than server will restart or not.
When you develop a node app and you make some changes, to see them in effect you have to restart the server.
When you launch your node.js application with Nodemon it will monitor for any changes and automatically restart the server, improving your productivity.
Nodemon is a utility that will monitor for any changes in your source and automatically restart your server. Perfect for development. Install it using npm.
npm install -g nodemon
How to use nodemon?
nodemon "filename" ignore the quotation and place name of the server file.
Nodemon:
monitors for any changes in your Node.js application
automatically restarts the server,
saving time and tedious work.
it's one way to make your development efficient with Opn:
Opn is a dependency that opens web browser links, files, and executables. We will be using Opn to automatically open a web browser to our local host every time our server restarts.Install with npm
npm install opn.
How to use node?
node "filename" ignore the quotation and place the filename (ex app.js ,server.js)
node:
no automatic restart the server every time you do the tedious work
no monitors for any change
nodemon is like a live-server for your node application. any changes made in your node application will get reflected as server will restart again.
as stated here :
nodemon will watch the files in the directory in which nodemon was
started, and if any files change, nodemon will automatically restart
your node application.
nodemon is a tool that helps develop node.js based applications by automatically restarting the node application when file changes in the directory are detected.
To use nodemon, replace the word node on the command line when executing your script.
In terminal,instead of typing node app.js,you can type: npm start
In package.json file,you can change it to:
"scripts": {
"start": "nodemon app.js"
},
In short,it is like a live server for node js, like we have in HTML & CSS.
When you are using node you have to restart on your own to see the changes you made But nodemon watches the particular path for any changes.If you make any changes in your file, nodemon will restart it for you.
when we install node, we will get automatically node and npm global variable.
for using nodemon you need to install it
npm install -g nodemon
we can access files with node as well but each time when we do changes we need to stop server and restart it.
node "filename" // provide filename
but if we accessing file with nodemon you no need to stop server and restart it only one line of command will save restart server time
nodemon "filename" // provide filename
this one line helps you saving lot of development time and test your sample javascript code
Nodemon stands for Node Monitor.
When you run a server using the command node index.js, after every change in your code you have to again run the node index.js command and reload the page to see the changes. Nodemon solves this problem for you. It auto-updates the server for you.

How to automatically reload Node.js project when using pm2

I am currently programming Node.js with Express.js, and every time I change a line of code in the file router or app, I need to type the command:
pm2 reload id_project.
How do I make pm2 auto-reload the project when a file is changed?
You need to start your pm2 project with the --watch option:
pm2 start <script|name|id> --watch
Where <script|name|id> refers to:
script the path to the script you want to let pm2 handle
name the name of the configuration in the "ecosystem" file
id refers to an already running application using pm2, which can be obtained using pm2 list (note that this would actually require a restart instead of start, so it's probably the least desirable of the options)
You could also specify which files/directories to ignore:
pm2 start <script> --watch --ignore-watch "node_modules"
Watch & Restart
Or create an "ecosystem" json file describing how you want pm2 to treat your project:
{
"name": "project_name",
"script": "index.js",
"watch": true,
"ignore_watch": ["node_modules"]
}
JSON options
PM2 comes with a handy development tool that allow you to start an application and restart it on file change:
# Start your application in development mode
# it print the logs and restart on file change too
# Two way of running your application :
pm2-dev start my-app.js
# or
pm2-dev my-app.js
By default, pm2 doesn’t automatically refresh our server every time we change files.
You need to start your pm2 project with the --watch cli argument in order to tell pm2 to refresh when files have changed:
pm2 start id_project --watch
check out the docs for more details, or #rogier-spieker answer which is more detailed.
pm2 is a Node process manager that has lots of bells and whistles. you can run the below command to automatically restarting the node application when file changes in the directory are detected.
pm2 start index.js --watch
Note that because pm2 runs things in the background, you can’t just ctrl+c your way out of a running pm2 process. You have to stop it by passing the ID or the name.
pm2 stop 0
pm2 stop index
other two options are below
npx supervisor index.js
nodemon index.js

Categories

Resources