I was working in a project which I cloned from a GitLab repo, while I was running it locally it gave me this error
npm run dev
> ideeza-web-app#1.0.0 dev
> env TAILWIND_MODE=watch next -p 3200
'env' is not recognized as an internal or external command,
operable program or batch file.
I was expecting it to run after installing dotnev,
I installed dotnev and did an " npm update " too, however still, it's not working.
Try installing cross-env with
npm install --save-dev cross-env
and then in package.json change env to cross-env, as suggested here. There's also the win-node-env module but I don't think it knows about that environment variable.
After changing that, the line in package.json should be:
"dev": "cross-env TAILWIND_MODE=watch next -p 3200",
If you need to handle signals in your program use cross-env-shell command (also provided by cross-env module) instead of cross-env.
I need a test.sh (bash)/test.ps1 (powershell) shell script of the following structure:
<build preparation>
npx react-scripts start
<build cleanup>
The build cleanup step should run after I stop the localhost development server.
Currently, if I send Ctrl+C to the terminal, it stops both the dev server as well as the parent script, so the build cleanup step is not executed.
I did not find similar questions online (I am not sure what to search). Preferably, I need both PowerShell and Linux solutions. My only guess is somehow the react-scripts command should "trap" the shell Ctrl+C invocation, and self-exit safely, but I do not know how to do that unless react-scripts implements it on their own.
In PowerShell you can use a try{}finally{} construct to ensure the cleanup is run on interruption:
# <build preparation>
try {
npx react-scripts start
}
finally {
# <build cleanup>
}
I received React project from github, and I encountered below error when I typed "npm start".
> #devias/material-kit-pro-react#4.1.0 start
> DISABLE_ESLINT_PLUGIN=true react-scripts start
'DISABLE_ESLINT_PLUGIN' is not recognized as an internal or
external command, operable program or batch file
I guess this is an environment issue.
But I cannot solve it.
Anyone can help me?
Actually, I cannot solve this issue on Windows, but when I run it on MacOS, there is no issue.
If anyone have ideas, let me know.
You can set environment variable:
Windows:
set DISABLE_ESLINT_PLUGIN=true
Docker:
docker run --rm -ti -p 8080:3000 -e DISABLE_ESLINT_PLUGIN=true .....
node node_modules\eslint\bin\eslint.js --help
I have the following scripts in my package.json file
"docker-build": "docker build -t mouchin/my-image-name .",
"docker-push": "docker push mouchin/my-image-name:latest",
"deploy-server": "ssh root#myserverip 'docker pull mouchin/my-image-name:latest'",
"deploy": "npm run docker-build && npm run docker-push && npm run deploy-server"
Problem is that i want to hide
mouchin/my-image-name and root#myserverip
Using some sort of env, maybe saving my variables in .env.prod , but i dont know if i can read the variables saved there directly into package.json
You can use environment variables in your rpm scripts just as you would if you execute the command on the command line (for example $SSH_HOST). However those variables will need to be set directly in the shell that executes the nom script.
Now in order to get the environment variables from an env file loaded, you have to do so manually. For example using a snippet like this:
if [ ! -f .env ]
then
export $(cat .env | xargs)
fi
Source
To execute this before any other script, you could use the built-in lifecylce scripts of npm.
Perhaps, you also want to change the snippet code to load one or the other .env file in case you have one for production and one for development. You will probably be able to use the environment variable NODE_ENV for this, as it is used in most setups, however this last step really depends on your build setup.
My project is based on create-react-app. npm start or yarn start by default will run the application on port 3000 and there is no option of specifying a port in the package.json.
How can I specify a port of my choice in this case? I want to run two of this project simultaneously (for testing), one in port 3005 and other is 3006
If you don't want to set the environment variable, another option is to modify the scripts part of package.json from:
"start": "react-scripts start"
to
Linux (tested on Ubuntu 14.04/16.04) and MacOS (tested by aswin-s on MacOS Sierra 10.12.4):
"start": "PORT=3006 react-scripts start"
or (may be) more general solution by IsaacPak
"start": "export PORT=3006 react-scripts start"
Windows JacobEnsor's solution
"start": "set PORT=3006 && react-scripts start"
cross-env lib works everywhere. See Aguinaldo Possatto's answer for details
Update due to the popularity of my answer: Currently I prefer to use environment variables saved in .env file(useful to store sets of variables for different deploy configurations in a convenient and readable form). Don't forget to add *.env into .gitignore if you're still storing your secrets in .env files. Here is the explanation of why using environment variables is better in the most cases. Here is the explanation of why storing secrets in environment is bad idea.
Here is another way to accomplish this task.
Create a .env file at your project root and specify port number there. Like:
PORT=3005
Create a file with name .env in the main directory besidespackage.json and set PORT variable to desired port number.
For example:
.env
PORT=4200
You can find the documentation for this action here: https://create-react-app.dev/docs/advanced-configuration
You could use cross-env to set the port, and it will work on Windows, Linux and Mac.
yarn add -D cross-env
then in package.json the start link could be like this:
"start": "cross-env PORT=3006 react-scripts start",
You can specify a environment variable named PORT to specify the port on which the server will run.
$ export PORT=3005 #Linux
$ $env:PORT=3005 # Windows - Powershell
Method 1
Create .env File in the root folder of a project
Set like this
PORT=3005
Method 2
In package.json
set PORT=3006 && react-scripts start
just run below command
PORT=3001 npm start
For windows, you can directly run this command on cmd
set PORT=3001 && npm start
In your package.json, go to scripts and use --port 4000 or set PORT=4000, like in the example below:
package.json (Windows):
"scripts": {
"start": "set PORT=4000 && react-scripts start"
}
package.json (Ubuntu):
"scripts": {
"start": "export PORT=4000 && react-scripts start"
}
You can modify your scripts inside package.json:
-on MacOs :
"scripts": {
"start": "PORT=9002 react-scripts start",
"build": "react-scripts build",
...
}
-on Windows
"scripts": {
"start": "set PORT=9002 && react-scripts start",
"build": "react-scripts build",
...
}
For my windows folks I discovered a way to change ReactJS port to run on any port you want.Before running the server go to
node_modules/react-scripts/scripts/start.js
In it, search for the line below and change the port number to your desired port
var DEFAULT_PORT = process.env.PORT || *4000*;
And you are good to go.
This worked for Linux Elementary OS
"start": "PORT=3500 react-scripts start"
Why not just
PORT=3030 npm run start
Just update a bit in webpack.config.js:
devServer: {
historyApiFallback: true,
contentBase: './',
port: 3000 // <--- Add this line and choose your own port number
}
then run npm start again.
you can find default port configuration at start your app
yourapp/scripts/start.js
scroll down and change the port to whatever you want
const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 4000;
hope this may help you ;)
How about giving the port number while invoking the command without need to change anything in your application code or environment files? That way it is possible running and serving same code base from several different ports.
like:
$ export PORT=4000 && npm start
You can put the port number you like in place of the example value 4000 above.
You can use same expression in the package.json scripts too.
like:
"start": "export PORT=4000 react-scripts start"
But for that latter one you will need to change the package.json, however, for the former one you will not change anything except port value in invocation from a command line.
Can specify Port in package.json , by defining port number:
"scripts": {
"start": "PORT=3006 react-scripts start"}
OR
Can specify port when running the script in terminal :
PORT=3003 npm start
Lot of answers have not mentioned one key part for windows. For me what worked to run react app in specified port in windows was with following command. You can change port number from example below. Dont forget to use &&.
set PORT=4200 && react-scripts start
Changing in my package.json file "start": "export PORT=3001 && react-scripts start" worked for me too and I'm on macOS 10.13.4
To summarize, we have three approaches to accomplish this:
Set an environment variable named "PORT"
Modify the "start" key under "scripts" part of package.json
Create a .env file and put the PORT configuration in it
The most portable one will be the last approach. But as mentioned by other poster, add .env into .gitignore in order not to upload the configuration to the public source repository.
More details: this article
Try this:
npm start port=30022
In case you have already done npm run eject, go to scripts/start.js and change port in const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000; (3000 in this case) to whatever port you want.
I just create .env in the root of my project and change the PORT=3001
In my case, my react project had two files: .env and .env.development.
I added this to .env.development to get it working with the npm start command for development:
PORT=3001
It would be nice to be able to specify a port other than 3000, either as a command line parameter or an environment variable.
Right now, the process is pretty involved:
Run npm run eject
Wait for that to finish
Edit scripts/start.js and find/replace 3000 with whatever port you want to use
Edit config/webpack.config.dev.js and do the same
npm start
In Windows it can be done in 2 ways.
Under " \node_modules\react-scripts\scripts\start.js" , search for
"DEFAULT_PORT" and add the desire port number.
E.g : const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 9999;
In package.json , appent the below line.
"start": "set PORT=9999 && react-scripts start"
Then start the application using NPM start. It will start the application in 9999
port.
In Powershell on Windows (Run as Administrator):
(cd to your CRA app root folder)
$env:PORT=3002 ; npm start
In case you run npm start in a Dockerfile, and you can't map ports in a docker run, like doing something like -p 3001:3000, this works:
FROM node
ENV PORT=3001
# whatever here, COPY .. etc.
CMD npm start
Or you can pass the port number as an argument in a docker buid:
FROM node
ARG PORT=${PORT}
ENV PORT=${PORT}
# whatever here, COPY .. etc.
CMD npm start
using --build-arg in docker buid
docker build --build-arg PORT=3001 .
Edit the webpack.config.js and add the port you want to run this on. This is what you are looking for:
'devServer:
{ port: 3005,
historyApiFallback: true,
},
and
output: {
publicPath: "http://localhost:3005/",
},
You have need to update your package.json to specify different PORT
In the script section replace start command like following: -
Make sure mentioned PORT is free to listen
"start": "export PORT=3001; react-scripts start"
Your application will start at http://localhost:3001
Thanks