依賴問題（ASP.NET Core + React.js）

Question

在使用 React.js 項目創建新的 ASP .NET Core (3.1) 應用程序后，我嘗試運行它，但出現以下錯誤：

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:

There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.

The react-scripts package provided by Create React App requires a dependency:

"webpack": "4.42.0"

Don't try to install it manually: your package manager does it automatically.
However, a different version of webpack was detected higher up in the tree:

C:\Users\xxxx\node_modules\webpack (version: 5.25.1)

Manually installing incompatible versions is known to cause hard-to-debug issues.

If you would prefer to ignore this check, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That will permanently disable this message but you might encounter other issues.

To fix the dependency tree, try following the steps below in the exact order:

1. Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
2. Delete node_modules in your project folder.
3. Remove "webpack" from dependencies and/or devDependencies in the package.json file in your project folder.
4. Run npm install or yarn, depending on the package manager you use.

In most cases, this should be enough to fix the problem.
If this has not helped, there are a few other things you can try:

5. If you used npm, install yarn (http://yarnpkg.com/) and repeat the above steps with it instead.
This may help because npm has known issues with package hoisting which may get resolved in future versions.

6. Check if C:\Users\xxx\node_modules\webpack is outside your project directory.
For example, you might have accidentally installed something in your home folder.

7. Try running npm ls webpack in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed webpack.

If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That would permanently disable this preflight check in case you want to proceed anyway.

P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!

npm ERR! code ELIFECYCLE

npm ERR! errno 1

))
System.Threading.Tasks.Task.ThrowIfExceptional(bool includeTaskCanceledExceptions)

InvalidOperationException: The NPM script 'start' exited without indicating that the create-react-app server was listening for requests. The error output was:

There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.

The react-scripts package provided by Create React App requires a dependency:

"webpack": "4.42.0"

Don't try to install it manually: your package manager does it automatically.
However, a different version of webpack was detected higher up in the tree:

C:\Users\xxx\node_modules\webpack (version: 5.25.1)

Manually installing incompatible versions is known to cause hard-to-debug issues.

If you would prefer to ignore this check, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That will permanently disable this message but you might encounter other issues.

To fix the dependency tree, try following the steps below in the exact order:

1. Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
2. Delete node_modules in your project folder.
3. Remove "webpack" from dependencies and/or devDependencies in the package.json file in your project folder.
4. Run npm install or yarn, depending on the package manager you use.

In most cases, this should be enough to fix the problem.
If this has not helped, there are a few other things you can try:

5. If you used npm, install yarn (http://yarnpkg.com/) and repeat the above steps with it instead.
This may help because npm has known issues with package hoisting which may get resolved in future versions.

6. Check if C:\Users\xxx\node_modules\webpack is outside your project directory.
For example, you might have accidentally installed something in your home folder.

7. Try running npm ls webpack in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed webpack.

If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That would permanently disable this preflight check in case you want to proceed anyway.

P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!

我已嘗試按照此錯誤中包含的說明進行操作，但隨后我遇到了一個帶有 400 錯誤的空白頁面。 有誰知道如何解決它？ 我已經嘗試了我在互聯網上找到的所有內容（還手動安裝了舊版本的 webpack），但到目前為止似乎沒有任何效果。

Answer 1

要解決此問題，除了 dotnet 3.1 SDK 之外，您還需要節點 package 管理器 (npm)。

您可以在此處下載並安裝它： https://nodejs.org/de/ （我會推薦用於 Windows 的巧克力）

安裝后，您可以使用npm --version檢查您的 npm 版本。 如果沒有答案並且您在 Windows 上，則必須重新啟動計算機一次。

如果 npm 安裝成功，您必須使用終端（或 powershell）導航到您的項目文件夾並運行命令npm install以重新安裝所有依賴項。

如果您在安裝所有模塊時仍然遇到問題，您可以檢查 package.json 文件以查看您使用哪個版本安裝了哪些軟件包，然后簡單地更新或刪除那里的軟件包。 完成編輯 package.json 后，您必須再次運行npm install 。

這是有關如何更接近您的問題的一般幫助

Answer 2

我不久前遇到了這個問題。 Go 到C:\Users\User有一個名為node_modules的文件夾刪除它。 不要在 VS 上運行npm install...只需 go （如果打開，請關閉並重新啟動）並創建一個新的 React.Net 核心項目。 VS 終端將下載並安裝所有軟件包。 這解決了我的問題。