React js- npm install not working in a github project - reactjs

I have a project from github and it has the recoil function. I'm trying npm install to run npm but it's not working:
Then I tried npm install --legacy-peer-deps, and got
61 vulnerabilities (4 low, 5 moderate, 39 high, 13 critical)
If I write npm start I got
Debugger attached.
> tgp-core-api#0.1.0 start
> PORT=3006 react-scripts start
'PORT' is not recognized as an internal or external command,
operable program or batch file.
Waiting for the debugger to disconnect...

It still says your debugger attached when you run "npm install".
Try to stop debugging (Debug > Stop Debugging or Shift+F5).

well i found out that inside my package.json i had :
"scripts": {
"start": "Port=3006 react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
so i deleted Port=3006, with that i got:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
and it worked!

Related

npm run <script-name> is failing

I want to build React project as per environment like development, staging and production.
below is snapshot of scripts section inside package.json file.
"scripts": {
"start development": "REACT_APP_ENV=development react-scripts start",
"start staging": "REACT_APP_ENV=staging react-scripts start",
"start production": "REACT_APP_ENV=production react-scripts start",
"build development": "REACT_APP_ENV=development react-scripts build",
"build staging": "REACT_APP_ENV=staging react-scripts build",
"build production": "REACT_APP_ENV=production react-scripts build",
"build": "react-scripts build",
"start": "react-scripts start",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
So as per scripts, 'build development' should build project for development environment.
Now as i run following command in project home directory by specifying environment, ( staging builds for staging env)
npm run 'build staging'
below shown error is displayed and command exits
> testapp#0.1.0 build staging
> REACT_APP_ENV=staging react-scripts build
sh: 1: /tmp/build: not found
Interesting thing is that, the command runs perfectly fine on other systems and creates build folder without any issues but it is throwing error on my current system.
All of my systems are running Ubuntu 20.04.4 LTS
Guys any idea about what might be the issue?
Adding cross-env as dependency and changing scripts to use _ instead of space as shown below resolved the issue
"scripts": {
"start_development": "cross-env REACT_APP_ENV=development react-scripts start",
"start_staging": "cross-env REACT_APP_ENV=staging react-scripts start",
"start_production": "cross-env REACT_APP_ENV=production react-scripts start",
"build_development": "cross-env REACT_APP_ENV=development react-scripts build",
"build_staging": "cross-env REACT_APP_ENV=staging react-scripts build",
"build_production": "cross-env REACT_APP_ENV=production react-scripts build",
"build": "react-scripts build",
"start": "react-scripts start",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
Now the following command runs on all platforms without any issues
npm run build_staging

react-scripts is not recognized as an internal or external command which have some basic folder structure

I have a basic folder structure in React by my friend. At first, I run the npm install.
Then, I run the following command to start the server. But could not work out.
Could you please help me and thanks in advance?
Below is my package.json file
{
"private": true,
"dependencies": {
"todomvc-app-css": "^2.0.0",
"todomvc-common": "^1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
}
*Below is my folder structure *
enter image description here
Now I am trying to run the npm run start. But it couldn't work. It says that

How to set Firefox (Dev Edition) as my default browser for npm start in React

I want to use firefox with create-react-app start, but I keep when I follow the advice of adding.
"scripts": {
"start": "BROWSER='firefox' react-scripts start ",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
or (without quotes),
"scripts": {
"start": "BROWSER=firefox react-scripts start ",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
I get the error message:
'BROWSER' is not recognized as an internal or external command, operable program or batch file.
So how would I specify the BROWSER variable in my package.json file? I'm using Windows 10.

Port doesn't recognized while running multiple app of react on windows

I have multiple react apps example one parent app and in the parent app I have two more apps which are running on different port parent app is running on 3000 port and first child is running on 3005 and second child is running on 4000 port. I did some configurations in the package.json file in scripts section given below
parent app has
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"odmit": "npm start odmit_view",
"moderator": "npm start --prefix moderator",
"monitor": "npm start --prefix monitor",
"dev": "concurrently \"npm run odmit\" \"npm run moderator\" \"npm run monitor\""
},
first child have package.json is
"scripts": {
"start": "PORT=4000 react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
Second child have package.json
"scripts": {
"start": "PORT=3005 react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
This will fine when I'm running this on ubuntu with command npm run dev. When I run same command in windows then it will give me the bellow error that this port is not recognized.
'PORT' is not recognized as an internal or external command,
[2] operable program or batch file.
[2] npm ERR! code ELIFECYCLE
[2] npm ERR! errno 1
[2] npm ERR! monitor#0.1.0 start: `PORT=4000 react-scripts start`
[2] npm ERR! Exit status 1
[2] npm ERR!
[2] npm ERR! Failed at the monitor#0.1.0 start script.
[2] npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
[1]
[1] > moderator#0.1.0 start D:\odmit_view\moderator
What is the issue in this can anyone please help me.
On Windows you need to set up the environment variable first:
"scripts": {
"start": "set PORT=4000 && react-scripts start"
}
Alternatively, you can also use cross-env to work on different environments (Windows and Ubuntu) like so:
"scripts": {
"start": "cross-env PORT=4000 react-scripts start"
}

react-scripts: command not found in react app

Im running a react-app on localhost and this error popped out. I have installed the correct dependencies with npm install, but for a reason i don't know it doesn't find the command react-scripts.
Nice to meet you.
Please check your node version.
After setup your node.exe.
And set the below contents to your package.json file.
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
Then please execute the command line.
"npm start"
Best regards.

Resources