react-scripts: command not found error – Fix

By /

While working with React JS you might have encountered the error “react-scripts: command not found” when trying to start the development server using npm start command. This error usually occurs when you try to run the project for the first time after cloning or initial setup.

In this article, we will discuss the common cause of the error and the solutions to fix this react error.

What is the main cause of “react-scripts: command not found” error?

This error occurs when you try to run the npm start command to start your React application development server. This is because the “react-script” package is either missing or not installed properly. This can occur for the following reasons:

  1. You forgot to install the dependencies of the project after you have cloned the project for the first time.
  2. The react-script package was not installed correctly in your project.
  3. You are trying to run the npm start command from a directory that do not have the package.json file.
  4. If you have initialized the react project using yarn and using npm install command to install the dependencies. This might corrupt your installation and thus you get the “command not found” error in your terminal.

Solutions to fix the “react-scripts: command not found” error

Now, that we know about some of the common reasons why this error might occur in our react project, let’s look at some of the solutions that might fix the error easily.

Solution 1: Install package.json dependencies

One of the common mistakes we can make after we clone a project is we forget to install the dependencies. And if the dependencies of your React project are not installed you will get the “react-scripts: command not found” error in your terminal.

So the first thing you should do is to install all the npm dependencies using the following command:

#for npm user
npm install

#for yarn user
yarn

This command will install all the package.json dependencies in your react project. Now, you can start your project without any errors.

Solution 2: Check if the react-scripts package is installed

One of the common causes of the error is that the react-scripts package is not installed in your project. So make sure you have the react-scripts package installed in your package.json file.

The react-scripts name should be under the dependencies section in the package.json file.

{
  "dependencies": {
    "react-scripts": "5.0.0",
    "react": "^18.0.0",
    "react-dom": "^18.0.0"
  }
}

If it is not installed in your project, then install it in your project using the following command in your terminal:

npm install react-scripts

If you are using yarn then use the yarn command:

yarn add react-scripts

Once installed re-run npm start to start your development server and now you should not get the error.

Solution 3: Delete node_module folder and reinstall dependencies

Now, if the above solution did not work for you then you can try deleting the node_modules folder and reinstalling all the dependencies again using npm install command.

To delete node_module use the following command:

#linux /macOS
rm -rf node_modules

#for windows
rd /s /q "node_modules"

Also, delete the package-lock.json file. (DO NOT delete package.json file)

#linux/macOS
rm -f package-lock.json

#windows
del package-lock.json

Once deleted, clear npm cache using :

npm cache clean --force

Finally, reinstall all the dependencies using the following command:

npm install

This will reinstall all the dependencies for the project as specified in package.json file.

For Yarn User

If you have been using yarn instead of npm then follow the steps below:

  1. Delete node_modules (same command as shown above)
  2. Delete yarn.lock using rm -f yarn.lock (for windows del yarn.lock)
  3. Next, install all dependencies using yarn command.
  4. Start the development server using yarn start command.

Now, when you run your development server and the error “react-scripts: command not found” should get resolved.

Solution 4: Use the correct command to install dependencies

If you use the yarn package manager then you should not use npm install command to install packages. Since yarn and npm are not fully compatible with each other so using them together will cause problems and errors in your react project.

Using npm to install packages in a Yarn project can lead to the corruption of the dependency tree and this might lead to “command not found” errors.

So stick to one package manager when creating a project and installing dependencies to that project.

Conclusion:

In this article, we have learned about the cause and the solutions for the “react-scripts: command not found” error.

This error mainly occurs when we try to start our development server and the package “react-scripts” is not found in the project.

To solve this we have to install the react-scripts package using npm install or yarn command in your react project.

Alternatively, you can delete the node_modules folder and the package-lock.json file and do a fresh installation for all the dependencies in your project.

Hope the above solutions resolve the error and you can continue building your project.

Related Posts

Scroll to Top