Running App when the port is busy

Is this a bug report?

Yes

Environment

1. Operating system: MacOS
2. Node v9.4.0
3. npm 5.6.0
4. Terminal: iTerm2 (with http://ohmyz.sh/)
5. "react-scripts": "1.1.0"

Steps to Reproduce

• Open a Tab in your Terminal
• Run app xxx in port 3000
• Open another terminal
• Run app yyy in port 3000.
• The app yyy should let you know that the port is busy (now, read the Expected Behavior)

Expected Behavior

You should see the question “Would you like to run the app on another port instead?” in app yyy If you answer No, the process should quit (the process of app yyy).

Actual Behavior

? Something is already running on port 3000. Probably:
  node scripts/start.js (pid 63408)
  in /Users/noel/xxxx/xxx

Would you like to run the app on another port instead? No

The process is not killed, and you have to do it manually.

This is a YouTube video of the bug: https://youtu.be/n9IQ8H2TfQA

package.json:

{
  "name": "indiebiz-frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "cross-env": "^5.1.3",
    "node-sass-chokidar": "0.0.3",
    "npm-run-all": "^4.1.2",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-router-dom": "^4.2.2",
    "react-scripts": "1.1.1"
  },
  "scripts": {
    "build-css": "node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/",
    "watch-css": "npm run build-css && node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/ --watch --recursive",
    "start-js": "react-scripts start",
    "start": "npm-run-all -p watch-css start-js",
    "build-js": "react-scripts build",
    "build": "cross-env NODE_PATH=src npm-run-all build-css build-js",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

[bondz]

@BrodaNoel This is because npm-run-all -p runs the processes in parallel using separate processes. The react-scripts command correctly kills its own process, but the other watch process is still running in a separate process without exiting.

To make it work correctly, use the race option of npm-run-all, that’ll terminate both processes when either exits.

Changing your script to npm-run-all -p -r watch-css start-js should fix it.

[iansu]

Closing this issue since it isn’t a problem with Create React App.