2

I cloned a react project that contains the following package.json. After yarn, yarn start gave me the following error. I tried yarn add react-scripts start, but it still did not work.

I am using MacOS.

Could anyone help?

$ yarn start
yarn run v1.21.1
$ SET PORT=8000 && react-scripts start
/bin/sh: SET: command not found
error Command failed with exit code 127.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

package.json:

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-ui/core": "^4.9.8",
    "@microsoft/office-js-helpers": "^1.0.2",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/react-stripe-elements": "^6.0.4",
    "@uifabric/react-cards": "^0.109.49",
    "axios": "^0.19.2",
    "color": "^3.1.2",
    "cross-storage": "^1.0.0",
    "dva": "^2.4.1",
    "dva-model-creator": "^0.4.3",
    "formik": "^2.1.4",
    "lodash": "^4.17.15",
    "moment": "^2.24.0",
    "monaco-editor": "^0.20.0",
    "node-sass": "^4.13.1",
    "office-ui-fabric-react": "^7.105.4",
    "query-string": "^6.11.1",
    "react": "^16.13.1",
    "react-app-polyfill": "^1.0.6",
    "react-dom": "^16.13.1",
    "react-monaco-editor": "^0.35.0",
    "react-scripts": "3.4.1",
    "react-stripe-elements": "^6.1.1",
    "redux-devtools-extension": "^2.13.8",
    "styled-components": "^5.0.1",    
    "typescript": "^3.8.3",
    "yup": "^0.28.3"
  },
  "scripts": {
    "start": "SET PORT=8000 && react-scripts start",
    "build": "react-scripts --max_old_space_size=8096 build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@types/color": "^3.0.1",
    "@types/cross-storage": "^0.8.29",
    "@types/jest": "^25.1.4",
    "@types/lodash": "^4.14.149",
    "@types/node": "^13.9.5",
    "@types/query-string": "^6.3.0",
    "@types/react": "^16.9.27",
    "@types/react-dom": "^16.9.5",
    "@types/react-redux": "^7.1.7",
    "@types/styled-components": "^5.0.1",
    "@types/yup": "^0.26.33"
  }
}
CoryCoolguy
  • 1,065
  • 8
  • 18
SoftTimur
  • 5,630
  • 38
  • 140
  • 292

3 Answers3

4

On MacOS you don't need the SET. Change the content of the start script of the package.json to PORT=8000 react-scripts start.

Better yet, to support cross-OS environment variables setting you could use something like cross-env . To do so, add the dependency to cross-env (yarn install --dev cross-env) and then rewrite the start script to cross-env PORT=8000 react-scripts start.

GavinoGrifoni
  • 743
  • 2
  • 12
  • 33
4

On Posixes, the most compatible is "env PORT=8000 react-scripts start".

This is why the cross-env package exists; it does the right thing on both Windows and Posix systems.

AKX
  • 152,115
  • 15
  • 115
  • 172
1

I think what you're looking for is this, to set the environment variable before executing the command: PORT=8000 react-scripts start, as Linux/Unix systems don't use the SET command to set environment variables like Windows does

If you're having issues with the react-scripts command not being found, directly reference the local version of the package using this command: PORT=8000 ./node_modules/.bin/react-scripts start

awarrier99
  • 3,628
  • 1
  • 12
  • 19
  • @SoftTimur This is because react-scripts is installed locally to the project, so it doesn't recognize the command you are trying to execute. I haven't used `yarn` before but with npm you use `npx react-scripts start` to use the local version of the package – awarrier99 Apr 08 '20 at 08:12
  • 1
    @SoftTimur you can also try changing `react-scripts start` to `./node_modules/.bin/react-scripts start` – awarrier99 Apr 08 '20 at 08:14
  • 1
    That won't work; it'd set a variable PORT first, but not export it to the react-scripts binary. – AKX Apr 08 '20 at 08:19
  • @AKX you're right, I forgot to remove the `&&` when copying and pasting OP's command – awarrier99 Apr 08 '20 at 08:20