Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – Package Json run multiple commands (React and nodejs)

This is my scripts

  "scripts": {
    "init-client": "cd ./client && npm start",
    "init-server": "cd ./server && npm run dev",
    "start": "npm run init-server && npm run init-client"
  },

I want to start the client and the server
but when I run the start command just the server running

Plus Do I can run each command in a separate terminal tab?

Tags:

2

Answers


  1. 0

    The issue you’re facing is due to the way the && operator works in shell scripts. When you use &&, it runs the command on the right only after the command on the left has completed successfully. In your case, the server starts and keeps running, so the client command never gets a chance to start.

    For Unix-based systems (like macOS), you can modify your scripts section in package.json as follows:

    "scripts": {
  "init-client": "cd ./client && npm start",
  "init-server": "cd ./server && npm run dev",
  "start": "npm run init-server & npm run init-client"
}

    For Windows, you would need to use the start command:

    "scripts": {
  "init-client": "cd ./client && npm start",
  "init-server": "cd ./server && npm run dev",
  "start": "start npm run init-server && start npm run init-client"
}

    Alternatively, you can use the concurrently package that will work on all systems.

    First, install concurrently as a dev dependency:

    npm install --save-dev concurrently

    And then modify your scripts as:

    "scripts": {
  "init-client": "cd ./client && npm start",
  "init-server": "cd ./server && npm run dev",
  "start": "concurrently "npm run init-server" "npm run init-client""
}
    Login or Signup to reply.
  2. 0

    The issue is that the start command runs init-server and init-client sequentially. To run them concurrently, you can use the concurrently package to resolve this issue:

    npm install concurrently –save-dev

    Then update your package.json file

    "scripts": {

    "init-client": "cd ./client && npm start",
    "init-server": "cd ./server && npm run dev",
    "start": "concurrently "npm run init-server" "npm run init-client""
    }

    Are you using macOS or windows?

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search