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.
Related
I need to run in the background a web app programmed in react and node which is hosted on a linux server. To do this I have created a service in
/etc/systemd/system
that does the following:
Description=Load React-Node Service.
[Service]
ExecStart=/usr/bin/yarn startLinux
WorkingDirectory=/home/developer/projectFolder/
[Install]
WantedBy=multi-user.target
But when I run it with systemctl start webapp.service I get the following error:
On the other hand if I run it with yarn start directly from ssh it works, but I need to run it through a service so I don't have to have the terminal open. The yarn start and yarn startLinux commands do the following:
"start": "cross-env NODE_ENV=development concurrently --kill-others-on-fail \"yarn server\" \"yarn client\"",
"startLinux": "cross-env NODE_ENV=development concurrently --kill-others-on-fail \"yarn server\" \"yarn clientLinux\"",
"client": "cd frontend && yarn start",
"clientLinux": "cd frontend && yarn startLinux",
"server": "nodemon --exec babel-node src/server.js"
Do you know what could be the problem?
Thanks!
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.
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.
My Vue app runs on port 8080. The setting of scripts: "serve": "vue-cli-service serve" and I start it up with yarn run serve.
My express server is set to run on port 4000. I start it up with yarn run dev with this scripts:
"client-install": "yarn add --prefix client",
"start": "node server.js",
"server": "nodemon server.js",
"client": "yarn start --prefix client",
"dev": "concurrently \"yarn run server\" \"yarn run client\""
while I try to run, it displays an error:
See what is already running on that port
netstat -a -n -o | find "4000"
TCP 127.0.0.1:4200 0.0.0.0:0 LISTENING 25160
get the pid, for example if pid is 25160 then
tasklist /fi "pid eq 25160"
node.exe 25160 Console 1 399,528 K
So then you can see what is using that port, in this case node.
Also checkout this project: https://github.com/pietheinstrengholt/vue-express-boilerplate
this problem's solve by using npm package called concurrently
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"