Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

npm install succeeds but npm run start fails to find both rimraf and react-scripts despite them being installed

Running Windows 10 (Build 18362), using Node.js v10.16.0, npm v6.9.0, and .Net Core v2.2.300. I created a sample React/Redux application in Visual Studio 2017 via File->New Project, selecting ASP.NET Core Web Application, then selecting React.js and Redux. However, when starting the application via Visual Studio, the browser encounters a 500 error and says:

An unhandled exception occurred while processing the request.
AggregateException: One or more errors occurred. (One or more errors occurred. (The NPM script 'start' exited without indicating that the create-react-app server was listening for requests. The error output was: 'rimraf' is not recognized as an internal or external command,

operable program or batch file.
npm ERR! code ELIFECYCLE

npm ERR! errno 1
npm ERR! [email protected] start: `rimraf ./build && react-scripts start`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

To start, I've uninstalled and reinstalled node and npm, deleted node_modules and re-ran npm install. I rebooted before and after re-installing node.

I know that rimraf is installed in the local .\node_modules directory, as I can successfully run .\node_modules\.bin\rimraf. And react-scripts start starts the react portion of the application successfully if I run .\node_modules\.bin\react-scripts start, but why would npm fail to find this?

It's to my understanding that npm adds the local node_modules\.bin to the PATH at the time of script execution, yet it still fails to find both rimraf and react-scripts despite them being accessible if providing an absolute path to the shell.

I have also tried adding .\node_modules\.bin to my system PATH, which allows me (provided I'm in the root of my app directory) to just run react-scripts start and have the application load, but npm run start still fails.

Here is my package.json:

{
  "name": "WebApplication1",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "bootstrap": "^4.3.1",
    "jquery": "3.3.1",
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-redux": "^5.0.6",
    "react-router-bootstrap": "^0.24.4",
    "react-router-dom": "^4.2.2",
    "react-router-redux": "^5.0.0-alpha.8",
    "react-scripts": "^1.1.5",
    "reactstrap": "^6.3.0",
    "redux": "^3.7.2",
    "redux-thunk": "^2.2.0",
    "rimraf": "^2.6.2"
  },
  "devDependencies": {
    "ajv": "^6.0.0",
    "babel-eslint": "^7.2.3",
    "cross-env": "^5.2.0",
    "eslint": "^4.1.1",
    "eslint-config-react-app": "^2.1.0",
    "eslint-plugin-flowtype": "^2.50.3",  
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^5.1.1",
    "eslint-plugin-react": "^7.11.1"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "scripts": {
    "start": "rimraf ./build && react-scripts start",
    "build": "react-scripts build",
    "test": "cross-env CI=true react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "lint": "eslint ./src/"
  }
}
like image 893
Meegul Avatar asked Jul 08 '19 21:07

Meegul


People also ask

How do I fix SH 1 react scripts not found?

Run the npm install react-scripts command to solve the "react-scripts: command not found" error. If necessary delete your node_modules directory and your package-lock. json file, reinstall your dependencies and restart your development server. Copied!

What is Rimraf NPM?

rimraf is an executable that is used to clean the installed node packages in a node based project. It basically executes the rm -rf command on the node_modules directory, but is a faster alternative.


2 Answers

Had the same problem, instead of debugging option IIS Express, select debugging option [name of your application].

like image 121
Y Stroli Avatar answered Oct 22 '22 01:10

Y Stroli


I resolved this running the ClientApp separately with yarn start and changing a command on Configure method of Startup.cs file:

app.UseSpa(spa =>
{
    spa.Options.SourcePath = "ClientApp";

    if (env.IsDevelopment())
    {
        //spa.UseReactDevelopmentServer(npmScript: "start");  <--- Remove this line

        // ****
        // **** Add this line
        // ****
        spa.UseProxyToSpaDevelopmentServer("http://localhost:3000");
    }
});

This enables it to start and restart faster. It's no longer waiting for your React app to rebuild each time.

Used as reference: https://learn.microsoft.com/en-us/aspnet/core/client-side/spa/react?view=aspnetcore-3.1&tabs=netcore-cli

like image 21
Ailin Albertoni Avatar answered Oct 21 '22 23:10

Ailin Albertoni