So, I've tried running npm i on my React app so that I can work concurrently on both front and back end at the same time. However, it seems to be hanging on the "install":
appName#0.1.0 install
cd server && npm i && cd ../client && npm i
Below are the package.json scripts I'm using:
"scripts": {
"start": "node server/server.js",
"dev": "concurrently \"cd server && npm run watch\" \"cd client && npm start\"",
"install": "cd server && npm i && cd ../client && npm i",
"build": "cd client && npm run build",
"seed": "cd server && npm run seed",
"test": "echo \"Error: no test specified.\" && exit 1",
"eject": "react-scripts eject"
},
What am I doing wrong? Any help is greatly appreciated!
You may be running into an infinite loop since you have defined an install script in your package.json. For more details on npm scripts configuration have a look here.
You might also be facing similar issues with some of the other scripts you have defined, e.g. build also calls itself npm run build. You should build the project code as part of the build script. See the CRA source build script for reference: https://github.com/facebook/create-react-app/blob/d960b9e38c062584ff6cfb1a70e1512509a966e7/package.json#L8
Try removing the install script and run the commands manually when you need to install dependencies for your project. The updated scripts:
"scripts": {
"start": "node server/server.js",
"dev": "concurrently \"cd server && npm run watch\" \"cd client && npm start",
"build": "cd client && npm run build",
"seed": "cd server && npm run seed",
"test": "echo \"Error: no test specified\" && exit 1",
"eject": "react-scripts eject"
},
As a side note/question, why don't you run npm i from the root of the project and then run your build and seed commands?
Only installing dependencies will not build your app, in most cases.
Related
I have a project that I want to deploy to heroku. The folder structure is as follows,
Root > client, server
these folders client and server has their own package.json file, so I wrote an installation command like "install" : "npm install --prefix client && npm install --prefix server".
but when I try to deploy it to heroku the build process keeps running npm install in the cli.
heroku cli while building
Root package.json
"scripts": {
"install": "npm install npm install --prefix server && npm install --prefix client",
"build": "npm run build --prefix client",
"start": "npm run server",
"client": "npm start --prefix client",
"server": "npm start --prefix server",
"server-watch": "npm run watch --prefix server",
"watch": "nodemon server.js --prefix src/server",
"test": "echo \"Error: no test specified\" && exit 1"
},
Client package.json
"scripts": {
"start": "react-scripts start",
"build": "BUILD_PATH='../server/public' react-scripts build ",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
Server package.json
"scripts": {
"install": "npm install",
"start": "node src/server.js",
"watch": "nodemon src/server.js",
"test": "jest",
"test-watch": "jest --watch"
},
in my package.json I have these scripts:
"scripts":
{
"lint": "./node_modules/.bin/eslint src",
"build": "npm run clean && npm run dev && npm run prod",
"tsc": "./node_modules/.bin/tsc",
"dev": "./node_modules/.bin/webpack --config webpack.dev.js",
"prod": "./node_modules/.bin/webpack --config webpack.prod.js",
"clean": "del /q inet-henge*.js* dist",
"watch": "./node_modules/.bin/webpack --config webpack.dev.js --watch",
"postinstall": "copy inet-henge.js \"..\\flask\\customer_topology\\static\""
}
But for some reason postinstall is completely ignored when i run npm run build. When I run it as standalone script, it runs, the file is copied to the new location. Path is correct. What could be the problem, I am on Windows
post<x> runs after <x> so postinstall runs after install and if you want a script to run after build it should be called postbuild See https://docs.npmjs.com/cli/v6/using-npm/scripts for more details.
I have a web app that uses Express backend and React frontend. The heroku-postbuild script in my package.json is as follows:
"heroku-postbuild": "npm run build && cd frontend && npm install && npm run build"
When I git push heroku master all seems to be fine until I get:
"Failed at the honeyman-designs#1.0.0 heroku-postbuild script."
this is the script:
"scripts": {
"start": "nodemon --watch backend --exec babel-node backend/server.js",
"build": "del -rf dist && babel backend -d dist",
"heroku-postbuild": "npm run build && cd frontend && npm install && npm run build"
},
The script inside frontend is:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
I'm using Windows 10 as my OS.
My Procfile contains:
web: node dist/server.js
I'm not too sure what I'm doing to get this error if anybody can help it would be appreciated.
I want to run the to build commands (clienr and server) in one npm run commands.
So on my package.json scripts section I added this line:
"build-all": "ng build --prod && ng run web-app:server",
The problem occurs when I run this commands: npm run build-all --configuration=qa.europe.
The configuration is loaded when I run each commands separately but not when I run the above commands.
Any ideas?
You can try this.
"scripts": {
"start:production": "npm install && npm run build && npm run start:prod",
"start:prod": "cross-env NODE_ENV=production node server",
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
npm run start:production it will run "start:production" & "start:prod" both scripts
You can try to use postinstall, it will look as next:
"scripts": {
"start": "ng run web-app:server",
"postinstall": "ng build --prod --configuration=qa.europe",
}
So after npm install, the build of your UI starts. And after that will start your server.
I want to run a command like: npm run start:dev to make my node server runs but after webpack finished building bundles.
My current npm scripts are:
"scripts": {
"start": "node server/server.js",
"start:dev": "npm run build:prod & npm start",
"lint": "eslint *",
"build:dev": "webpack",
"build:prod": "webpack -p --env production",
"dev-server": "webpack-dev-server",
"test": "cross-env NODE_ENV=test jest --config=jest.config.json"
},
The current command will kick both operations together.
Typo: you don't actually want to use &, you want &&:
"start:dev": "npm run build:prod && npm start",
A single ampersand will background the run:build job and cause start to run concurrently.