My app did work but I want to re-organise it so it is easier to manage. I want to move the server files from the root to their own directory.
Currently I use concurrently to load my server and client so they can run simultaneously.
When I run npm run dev I want concurrently to load the server and the client. When run the server loads, the client fails and a new folder called client gets generated in within the server directory.
My new folder structure
client
client/package.json
server
server/package.json
The previous (working) folder structure
server files in root
package.json {for server}
/client {all client files including /client/package.json}
I am using concurrently and am trying to get it now to work. I think I need to do is change to the correct syntax in my server/package.json file but the changes have not worked.
concurrently code in my server package.json file
"dev": "concurrently \"npm run server\" \"npm run client\"",
I get the error
] /bin/sh: ..npm: command not found
[1] ..npm run client exited with code 127
I have tried changing the line different ways but still cannot get the client to load
"dev": "concurrently \"npm run server\" \"cd ../client && /npm run client\"",
"dev": "concurrently \"npm run server\" \"cd ../client && /npm run client\"",
"dev": "concurrently \"npm run server\" \"npm run ./client\"",
"dev": "concurrently \"npm run server\" \"npm run ../client\"",
"dev": "concurrently \"npm run server\" \"npm run //client\"",
I think it may be a simple syntax change however the fact a new directory is getting created makes me a bit more concearned. Any solutions or thoughts would be appreciated.
The correct code in the package.json for the server is below
"scripts": {
"start": "node server.js",
"server": "nodemon server.js",
**"client": "npm start --prefix ../client/",**
"clientinstall": "npm install --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client "
},
I had to put the path to the new client directory after the command. Seems obvious now I know but I was focussing on the other line.
Combine two commands in the second argument that target the client location and npm command
"dev": "concurrently \"npm run server\" \"cd ../client && npm run client\"",
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!
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
I have start defined in my scripts on pakcage.json but npm still gives me the start not found error
"scripts": {
"start": "node server.js",
"server":"nodemon server",
"client":"npm start --prefix client",
"dev":"concurrently \"npm run server\" \"npm run client\""
},
This is for Node version 10.16.0 on Windows 10
Basically, you don't need a start script. In your package.json file,
...
"main": "server.js",
...
and in the terminal go to your project directory and type
nodemon
This will start your app upon your configurations!
That should help!
So I am trying to make my first react app. I have it working just fine locally. The problem is that I cannot upload my project to Heroku.
This is my app setup:
my file arrangement. I built this starting with a create-react-app, wrapped that entire thing in a "client" folder, and created a normal node server arrangement outside. I haven't touched my react app's package.json" except to add a socketio dependency, other than that it is exactly what create-react-app spits out.
I get this error on console when attempting to upload:
"sh: 1: react-scripts: Permission denied"
I have gone through https://devcenter.heroku.com/articles/nodejs-support, but to no avail.
This is my "outside" package.json scripts and dependencies
"scripts": {
"client": "npm start --prefix client",
"server": "node server.js",
"start": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "cd client && npm run build"
},
"dependencies": {
"concurrently": "^4.0.1",
"express": "^4.16.4"
"socket.io": "^2.1.1"
}
UPDATE:
I've not gotten my application to work yet HOWEVER I finally found something interesting.
This: https://github.com/mars/heroku-cra-node
Looks like a barebones application I can essentially my stuff to, and have it work on Heroku. I've not added my code yet, I'll report back.
UPDATE:
Yep, seems to get past this permission BS. Now I just have to deal with getting socket.io client to connect... -_-
Change your script to this:
"scripts": {
"start": "node index.js",
"server": "nodemon index.js",
"client": "npm run start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_PRODUCTION=false npm install --prefix client && npm run build --prefix client",
},
npm run dev will start your server and client in development mode...
You can also install nodemon to make your life easier...