npm install 成功，但 npm run start 无法找到 rimraf 和 react-scripts，尽管它们已安装

Posted 2023-02-22

【中文标题】npm install 成功，但 npm run start 无法找到 rimraf 和 react-scripts，尽管它们已安装

【英文标题】：npm install succeeds but npm run start fails to find both rimraf and react-scripts despite them being installed

【发布时间】：2019-11-18 10:12:49

【问题描述】：

运行 Windows 10（内部版本 18362），使用 Node.js v10.16.0、npm v6.9.0 和 .Net Core v2.2.300。 我在 Visual Studio 2017 中通过 File->New Project 创建了一个示例 React/Redux 应用程序，选择 ASP.NET Core Web Application，然后选择 React.js 和 Redux。但是，当通过 Visual Studio 启动应用程序时，浏览器遇到 500 错误并显示：

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! WebApplication1@0.1.0 start: `rimraf ./build && react-scripts start`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the WebApplication1@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

首先，我卸载并重新安装了 node 和 npm，删除了 node_modules 并重新运行了npm install。我在重新安装节点之前和之后重新启动。

我知道 rimraf 安装在本地 .\node_modules 目录中，因为我可以成功运行 .\node_modules\.bin\rimraf。如果我运行.\node_modules\.bin\react-scripts start，react-scripts start 会成功启动应用程序的 react 部分，但是为什么 npm 会找不到呢？

据我了解，npm 在脚本执行时将本地 node_modules\.bin 添加到 PATH 中，但它仍然无法同时找到 rimraf 和 react-scripts，尽管如果提供到贝壳。

我还尝试将.\node_modules\.bin 添加到我的系统路径中，这允许我（假设我在我的应用程序目录的根目录中）只运行react-scripts start 并加载应用程序，但npm run start 仍然失败.

这是我的 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/"
  

【参考方案1】：

有同样的问题，而不是调试选项 IIS Express，选择调试选项 [您的应用程序的名称]。

【参考方案2】：

我通过yarn start 单独运行ClientApp 并更改Startup.cs 文件的Configure 方法上的命令解决了这个问题：

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");
    
);

这使它能够更快地启动和重新启动。它不再等待您的 React 应用程序每次都重新构建。

用作参考：https://docs.microsoft.com/en-us/aspnet/core/client-side/spa/react?view=aspnetcore-3.1&tabs=netcore-cli

【讨论】：

没有为我工作抛出：HttpRequestException：无法将请求代理到localhost:44397，因为对代理目标的请求失败。检查代理目标服务器是否正在运行并接受对localhost:44397 的请求。底层异常消息是“发送请求时发生错误。”。有关更多详细信息，请查看 InnerException。

【参考方案3】：

这可能是一个路径问题。就我而言，我在 TopShelf 服务中托管了一个 WebHost，而不是一个普通的 .Net 核心 Web 项目。我注意到它执行的路径与通过项目模板生成的路径不同：dotnet new react -o my-new-app。

在项目模板版本中，它从 ClientApp 文件夹运行 rimraf，而在我的应用程序中，它从 bin\Debug\netcoreapp3.0 文件夹运行。更改我的ClientApp\package.json 以引用正确的路径可以解决问题，但我希望有更好的解决方案：

"scripts": 
  "start": "cd ../../../../ClientApp && cd && .\\node_modules\\.bin\\rimraf ./build && .\\node_modules\\.bin\\react-scripts start",

【参考方案4】：

我遇到了同样的问题。我正在使用 VStudio 2019，并且正在做一个 React 测试应用程序。

我已经创建了 APP，然后在那个目录中我安装了 node 和 npm。我认为这是错误的。

我解决了，从零开始...我创建了一个新的测试目录，然后在该目录中安装了npm（已经安装了节点），最后创建了APP。 当我运行应用程序时，它出现了一条消息说“npm正在安装”..它可以工作..

When the App is created, node and npm have to be already installed.