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:
- You forgot to install the dependencies of the project after you have cloned the project for the first time.
- The
react-script
package was not installed correctly in your project. - You are trying to run the
npm start
command from a directory that do not have the package.json file. - If you have initialized the react project using
yarn
and usingnpm 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:
- Delete node_modules (same command as shown above)
- Delete yarn.lock using
rm -f yarn.lock
(for windowsdel yarn.lock
)- Next, install all dependencies using
yarn
command.- 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.