I have a React app and here is my folder setup:
If I cd src and then run node server.js, I can see my server is running based off messages in added into console.log.
But when I'm in the root folder and I run npm start, the server.js is not connected. Here is my root package.json, what am I missing?
If you want to run react app and server simultaneously, you can use concurrently. Install it, and modify your scripts section so you will have separate entries for react-scripts start and node src/server.js. Then you can run them both with concurrently. It will look something like this:
{
"scripts": {
"start-react-app": "react-scripts start",
"start-server": "node src/server.js",
"start": "concurrently \"npm:start-react-app\" \"npm:start-server\""
}
}
This way, when you run npm start it will launch both scripts.
Related
I want to run ../my_dir/my_script.js each time when I run node index.js from actual app project folder.
In others words, I need my_script.js to be common in every app (A,B,C...N) and executing before index.js
Structure:
+my_dir
-my_script.js
+appA
+node_modules
-package.json
-index.js
+appB
+node_modules
-package.json
-index.js
my_script.js
console.log('my_script.js from parent directory STARTED');
package.json (similar for each appA, appB ... etc)
{
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
//I HAVE TRIED
"start": "node ../my_dir/my_script.js",
"postinstall": "npm run-script ../my_dir/my_script.js",
"preinstall": "npm run --prefix ../my_dir/my_script.js",
}
}
index.js (similar for each appA, appB ... etc);
console.log('index.js STARTED');
If I try inside appA node index.js I got index.js STARTED
If I try inside appA npm start I got my_script.js from parent directory STARTED
Expected: (running both):
my_script.js from parent directory STARTED
index.js STARTED
Any idea how to achieve that?
I don't think it is possible to automatically have a second script run when using the command line node command.
What you can do is either run both scripts manually
node ../my_dir/my_script.js && node index.js
or bundle them in your package.json
"start": "node ../my_dir/my_script.js && node index.js",
and execute with
npm start
Your postinstall and preinstall are not quite right, those get run when doing npm install (you can put the post and pre keywords before any command https://docs.npmjs.com/cli/v9/using-npm/scripts)
so you could also do
"start": "node index.js",
"prestart": "node ../my_dir/my_script.js"
and execute with
npm start
again
i try many times but can not find the problem need argent help please help anyone.when i deployed on heroku backend routes work but client build static not work
this is my github repo https://github.com/Tanvir-Niloy/Manobik_Narsingdi
Heroku is mostly for making server side apis so you would connect it to your client side app to make it have server side.
From your package.json
"scripts": {
"start": "node server/server.js",
"server": "nodemon server/server",
"client": "npm start --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"
},
You also have a Procfile with the content: web: node server/server.js
Without the Procfile Heroku would have executed web: npm start which is the same as web: node server/server.js anyway.
But as you can see from the start script you are not executing your client project. You are merely running the backend but you are not serving your static websites.
You either need to host your client project somewhere (GitHub has some solutions: GitHub pages, Netlify, Vercel, ...) or you need to serve your static content from your server project. You are kinda doing it but as of now you are continuously changing your code:
app.use(express.static(Path.join(__dirname, '/client/build/static')))
To me it looks like you have a path issue here. Should be './../client/build/static' assuming the build files are placed in the client folder.
Sharing the build.log would also help to see if your project builds properly on Heroku.
I'm rather new to this area, so please excuse if this question is completely basic. I've seen some tutorials use nodemon to watch files, and restart servers on Nodejs backend. I've seen others use webpack to watch files such as create react app on frontend. Can you actually use nodemon to watch files and refresh pages on the front end?
Yes I believe you can set it up with your package.json scripts!
For instance with a node server with a create-react-app within a client folder you could declare a start script along the lines of:
"start": "concurrently \"nodemon server.js\" \"cd client && nodemon start\""
Then when you run npm start this will run nodemon on both the server file and the client folder
Just be aware this assumes your server file is named server.js and your client files are in a folder named client and will require you to have the concurrently dependency installed.
You could use something like this one if you already have create react app within a client folder.
"server": "nodemon server.js",
"client": "cd client && yarn start",
"dev": "concurrently --kill-others-on-fail \"yarn server\" \"yarn client\""
Concurrently allows us to run both on one terminal as well as it allows us to pass --kill-others-on-fail which means that if one breaks (control + c on mac), the other one will also break
I'm building a client with react and am running npm start and in package.json my scripts look like this:
"scripts": {
"start": "webpack-dev-server"
}
But i've also code other server side code in server/app.js that I want to run and if I run node app.js then that runs but i'd like server/app.js to be included with webpack-dev-server so that when I run npm start server/app.js is also run.
Is that possible? I was reading up on the various options and at this stage after the simplest.
Thx.
Update your script as follows:
"scripts": {
"start": "webpack-dev-server && node app.js"
}
I currently have an npm project built with vue-cli and socket.io server.
This is how my project is structured:
Project/
|--node_server/
| |--server.js
|--src/
| |--main.js
| |--App.vue
| |--other .vue files and folders
I do not know how to deploy this app on Heroku because I will need to run two scripts while deploying that is node server.js (in the node_server folder) and npm run build or npm run dev (in the root folder).
What are the steps on how to deploy it successfully? Heroku takes my project from github whenever I push and builds it automatically. I have tried deploying but it ends up with an error page.
Let's say you need to build the front-end with build script first, and then you need to run nodejs server with start script which is node server.js.
...
"scripts": {
"build": "gulp or something idk"
"prestart": "npm run build",
"start": "node node_server/server.js",
},
...
But if you need to run these two scripts at the same time you can achieve this with something like that:
...
"scripts": {
"build": "gulp or something idk"
"start": "npm run build & node node_server/server.js",
},
...
I hope it would be helpful.
For an example, you can take a look at the package.json of one of my project: https://github.com/hisener/pirate-radio/blob/master/package.json
For more information, please refer https://docs.npmjs.com/misc/scripts