npm start json-server in background - node.js

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.

Related

Running npm concurrently

I have been referencing this post: How can I run multiple npm scripts in parallel?
However, neither of my apps launch with npm run dev. Both apps exit with code 1.
My package.json:
"scripts": {
"start": "ng serve",
"start:lt": "ng serve --configuration=lt",
"dev": "concurrently --kill-others \"npm start\" \"npm start:lt\""
}
And yes, I have concurrently installed.
you can use https://www.npmjs.com/package/foreman module to start app.
first, you need Procfile with commands, you plan to execute in parallel
start: ng serve
start_lt: ng serve --configuration=lt
second, add it to package.json
"scripts": {
"start":"nf start"
}
third - define PORT variable in .env file
PORT=4201
and, finaly, you can start your applicaiton by npm start - it will start foreman executable, that starts both start and start_lt components in parallel

trying to run react and node.js concurrently

package.json
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "cd profile-app-server && nodemon server.js",
"client": "cd client/profile-front-end && npm start",
"start": "concurrently \"npm run dev\" \"npm run client\" "
},
npm ERR! enoent ENOENT: no such file or directory, open '/Users/SebastianRusso/Desktop/profile-app/package.json'
when i run them separately, they both work fine. the server is running on 3001, so not to interfere with react.
the app is called, 'profile-app' which holds a 'client folder' which holds, 'profile-front-end'
the app, 'profile-app' also holds 'profile-app-server'
i'm wondering if i have the paths mixed up somehow. I've played around and tried different things, but kind of at a road block now
so basically to make both run, only the client can be in another folder.
i put the server in a separate folder as well, but that was incorrect, and that's why npm start could not find the folder.
in the end i removed the server folder, and changed the code to this and it works (runs both client side and server side)
"dev": "nodemon server.js",
"client": "cd client/avybe-challenge-profile && npm start",
"start": "concurrently \"npm run dev\" \"npm run client\" "
My guess is you need to figure out the path to get from your server package.json to your client package.json file. The client path for your script may need to be slightly altered.
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "cd profile-app-server && nodemon server.js",
"client": "cd ../client/profile-front-end && npm start",
"start": "concurrently \"npm run dev\" \"npm run client\" "
},
Not sure if that's the correct path, but it is probably somewhere along those lines.

How to make nodejs and react use different ports

package.json file :
"start": "concurrently \"nodemon index.js --port 3000 \" \"react-scripts start --port 3000 \" ",
"start": "concurrently \"react-scripts start --port 3000\" ",
"build": "react-scripts build",
"server": "NODE_ENV=production node index.js",
so I can run both nodejs server and react at the same time. Either with npm run server and npm start or just with npm start which includes both
but because I have PORT=3001 in .env file
both server and react try to run on 3001 server. Of course it gives error "Something is already running on port 3001."
How can I make react have its own port 3000? Option --port 3000 do not help
You can override environment variables for each script.
For example:
{
"start": "concurrently \"PORT=3000 nodemon index.js\" \"PORT=3001 react-scripts start\""
}
You have to provide the ports explicitly either on the CLI or via your script.
{
"start:client": "PORT=3001 react-scripts start",
"start:server": "PORT=3000 nodemon index.js",
"start": "concurrently \"start:client\" \"start:server\""
}
This should make it easier to read.

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"
}

Concurrently does not modify NODE_ENV variable

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"

Resources