Unable to run react js project

Question

I have a project build using react js I want to execute it locally

What I have done so far :

1) installed node.js (windows 64 bit)

2) Followed till Step 3 from https://www.tutorialspoint.com/reactjs/reactjs_environment_setup.htm

Now I have

1) c://program files /nodejs/node_modules

2) Desktop/reactApp/node_modules

I places my project folder inside reactApp/ . so package.json is at reactApp/package.json

now when i try to run npm start

C:\Users\xxx\Desktop\reactApp>npm start

> [email protected] start C:\Users\jitendra\Desktop\reactApp
> PORT=8080 react-scripts start

'PORT' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: `PORT=8080 react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script 'PORT=8080 react-scripts start'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the liquid package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     PORT=8080 react-scripts start
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs liquid
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls liquid
npm ERR! There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\jitendra\AppData\Roaming\npm-cache\_logs\2017-05-03T08_13_40_048Z-debug.log

Here is my package.json file

{
  "name": "liquid",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {},
  "dependencies": {
    "bootstrap": "^4.0.0-alpha.6",
    "chart.js": "^2.5.0",
    "google-map-react": "^0.23.0",
    "lodash": "^4.17.2",
    "moment": "^2.18.1",
    "prop-types": "^15.5.8",
    "react": "^15.5.4",
    "react-chartjs-2": "^2.0.5",
    "react-dom": "^15.5.4",
    "react-redux": "^5.0.1",
    "react-router": "^2.8.1",
    "react-router-redux": "^4.0.5",
    "react-scripts": "^0.9.5",
    "react-sortable-tree": "^0.1.17",
    "react-table": "^5.5.3",
    "reactstrap": "^4.3.0",
    "redux": "^3.6.0",
    "redux-logger": "^2.7.4",
    "redux-thunk": "^2.1.0",
    "whatwg-fetch": "^2.0.1"
  },
  "scripts": {
    "start": "PORT=8080 react-scripts start",
    "build": "react-scripts build && aws s3 sync build/ s3://xxx.co/1micro",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "homepage": "http://xxx.co/1micro"
}

run an admin command prompt, go to the root of the project folder and run npm install, sometimes this fixes some issues with dependencies — Moe
– Moe, Commented May 3, 2017 at 8:21
Possible duplicate of How to specify a port to run a create-react-app based project? — Mayank Shukla
– Mayank Shukla, Commented May 3, 2017 at 8:22
@MayankShukla ,El Ruso 's answer is same as my json file . and error shows at the same line . May be it does not work on windows . — Nirali Joshi
– Nirali Joshi, Commented May 3, 2017 at 8:30
You have clearly used a package.json that is not of your project, if you really did follow the guide you are saying you woudln't be having those extra dependencies. Seems like you have mixed two projects. Please give the link to project you are trying to start — Zeus
– Zeus, Commented May 3, 2017 at 8:30
react-scripts is in correspondece with the project created using create-react-app, you if you are creating one yourself, you should be following the rest of the steps too from the link, i.e to configure webpack — Shubham Khatri
– Shubham Khatri, Commented May 3, 2017 at 8:32

Keshan Nageswaran · Accepted Answer · 2017-05-03 09:17:28Z

7

Create a .env file at your project root and specify port number there PORT=3005 then in package json start script use like this "start": "react-scripts start"

Sample package json file below

{
  "name": "r",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-scripts": "0.8.4"
  },
  "dependencies": {
    "react": "^15.4.2",
    "react-dom": "^15.4.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

edited May 3, 2017 at 9:17

answered May 3, 2017 at 9:02

Keshan Nageswaran

8,2064 gold badges30 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Nirali Joshi Over a year ago

It says , 'react-scripts' is not recognized as an internal or external command,

Keshan Nageswaran Over a year ago

Hope you executed npm install to get the dependencies to your machine first

Nirali Joshi Over a year ago

Yes, I have react and react-dom folder inside node_modules folder. when I try npm ls react-scripts , it says `-- UNMET DEPENDENCY react-scripts@^0.9.5 npm ERR! missing: react-scripts@^0.9.5, required by [email protected]

Keshan Nageswaran Over a year ago

@NiraliJoshi can you put react-scripts into dev dependencies instead of in dependencies and try npm install again

Keshan Nageswaran Over a year ago

@NiraliJoshi I have added a sample packagejson which would help

|

Wayneio · Accepted Answer · 2017-05-03 08:54:12Z

3

That PORT command will only work on Unix. Try opening a command window and setting the port variable in a windows way, I think it's (in powershell):

$env:PORT=3005

or, in a normal command window:

set PORT=3005

which you can then check works by running:

echo %PORT%

which should return 3005. Then, navigate to your reactApp directory and run:

react-scripts start

edited May 3, 2017 at 8:54

answered May 3, 2017 at 8:33

Wayneio

3,5969 gold badges47 silver badges78 bronze badges

7 Comments

Nirali Joshi Over a year ago

should i run $env:PORT=3005 at my project root directory ?

Nirali Joshi Over a year ago

it says , The filename, directory name, or volume label syntax is incorrect.

Keshan Nageswaran Over a year ago

@NiraliJoshi Run it on Windows Powershell $env:PORT=3005

Wayneio Over a year ago

Updated my answer. It doesn't matter where you are when you run the set environment params like PORT

Keshan Nageswaran Over a year ago

@Wayneio before you didn't mention about set command which can be used in cmd, but u was mentioning $env:PORT=3005 without exactly telling where to execute that was the problem so mentioned it

|

Manji · Accepted Answer · 2022-07-04 03:42:45Z

2

if above solutions does not fixed your problem, try the following this worked for me:

if you are not able to start react js project then do the following steps:

open package.json file
inside script replace the start command with below "start": "set PORT=3006 && react-scripts start"

answered Jul 4, 2022 at 3:42

Manji

515 bronze badges

Collectives™ on Stack Overflow

Unable to run react js project

3 Answers 3

8 Comments

7 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

8 Comments

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related