TimeoutException：Angular CLI 进程未在超时期限内开始侦听请求答案

【问题标题】：TimeoutException: The Angular CLI process did not start listening for requests within the timeout periodTimeoutException：Angular CLI 进程未在超时期限内开始侦听请求
【发布时间】：2019-08-19 17:41:37
【问题描述】：

我有一个内置于 VS2017 Pro 版本 15.9.8 的 Angular Web 项目。它编译为目标 .net framework 4.6，但在 IISExpress 中运行时，它总是超时。我尝试了以下方法：

在 Startup.cs 中，我将 spa.Options.StartupTimeout 指定为 2 分钟 [但仍然超时]
在ClientApp文件夹内，执行npm start，ng build：[它总是抱怨Error: Cannot find module '@angular/core/package.json'。

很多人说直接从命令行运行ng serve，但是项目是在VS2017中构建的，所以node_modules文件夹在项目的根目录下，而不是在ClientApp文件夹下。此外，@angular 文件夹不包含 core 文件夹，而是位于 @angular-devkit 文件夹下。

所以我的问题是：

如果在 VS2017 中运行，如何解决超时问题？
如果从命令行运行（例如ng serve），如何解决文件夹问题？

【问题讨论】：

标签： angular visual-studio-2017

【解决方案1】：

我有类似的经历，但使用的是 .NET Core 2.1 和 2.2。

浏览体验：

This 可以提供帮助（与 .NET Core 相关，而不是 .Net Framework 4.6）：

主要区别在于“文件夹问题”。在.NET Core 中，ClientApp 将所有 angular 文件夹集中在一处。

我的经验（使用 .NET Core 2.1 和 2.2）：

在ClientApp（即包含angular的文件夹）中的命令提示符下运行ng serve
然后，在项目文件夹的命令提示符下运行dotnet run。

希望这对某人有所帮助。

【讨论】：

【解决方案2】：

刷新 (F5) 页面为我解决了问题。

【讨论】：

【解决方案3】：

尝试（CTRL+F5）强制从服务器重新加载，它暂时解决了问题。

【讨论】：

【解决方案4】：

ASP.NET Core >= 3.0

如果您使用的是 asp.net core 3.0，那么您不应使用 UseAngularCliServer。您应该使用 asp.net 作为开发代理。更多细节是here

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

                if (env.IsDevelopment())
                {
                    spa.UseProxyToSpaDevelopmentServer("http://localhost:4200");
                }
            });

打开命令widnow，进入ClientApp并启动npm server。

c:\your\project\directory\> cd ClientApp
c:\your\project\directory\> npm start

ASP.NET Core 2.0

refresh(F5)您的浏览器或增加 SPA 配置的超时时间

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

                if (env.IsDevelopment())
                {
                    spa.UseAngularCliServer(npmScript: "start");
                    spa.Options.StartupTimeout = TimeSpan.FromSeconds(200); // <-- add this line
                }
            });

在开发环境中，npm 在服务之前构建一个 Angular 应用程序。有时构建需要超过 120 秒。

【讨论】：

对我来说，错误是“......超时时间为 0 秒”。启动超时的默认值是多少？你的意思是说默认超时是 120 秒？
您链接到的 Microsoft 文档并没有说使用 UseProxyToSpaDevelopmentServer 是在 3.0 中执行此操作的唯一方法，只是您可以使用它来避免每次都等待角度服务器启动您更改并运行您的 C# 代码。 UseAngularCliServer 仍然是在 Asp.net core 3 中托管 Angular 的有效方式

【解决方案5】：

这是一种解决方法。使用 ASP .NET Core 3.1 测试

1.在您的 Startup 类中，将 spa.UseAngularCliServer 调用替换为以下内容：

spa.UseProxyToSpaDevelopmentServer("http://localhost:4200");

2.在命令提示符下，切换到 ClientApp 子目录，然后启动 Angular CLI 开发服务器：

cd ClientApp
npm start

来源：ASP.NET Core docs

【讨论】：

非常感谢，这节省了很多时间，所以我在更改后端时不需要重新启动服务器。
这是我需要的，一个单独的过程来启动它们，谢谢
您的意思是每次我们需要启动 Angular 应用程序时，我们都会从命令提示符手动启动它？

【解决方案6】：

遇到了同样的问题，稍晚点再次刷新浏览器，它运行良好。

解决方案说明：我们遇到了相同的行为，这是由于编译源文件所用的时间超过了允许的超时限制以连接到 Node/Angular CLI。

如果您刷新浏览器，它最终会连接，您就可以开始了。编译源文件后，不再发生超时。

我还为 SPA 配置设置了超时，如下所示（80 秒）。

参考。 The Angular CLI process times out first time debug is run

更新 2.0 使用 Angular 10.0 和 .Net Core 3.1

我还在 angular.json 文件的 serve 部分设置了 progress: true

【讨论】：

非常感谢。我必须更多地增加时间： if (env.IsDevelopment()) { spa.Options.StartupTimeout = new TimeSpan(0, 0, 360); spa.UseAngularCliServer(npmScript: "start"); }

【解决方案7】：

通过dotnet run 命令运行项目会给你实际的错误。就我而言，这是我项目的 bin/debug 目录的权限问题。以管理员身份运行 VS 解决了我的问题。

【讨论】：

【解决方案8】：

以from here 和here 为例，它似乎在.NET Core 3 和Angular 9 中运行良好。修改package.json 中启动Angular 服务器的方式以添加一个虚拟echo：

"start": "ng serve"

变成

"start": "echo Starting && ng serve"

【讨论】：

这个答案有效，但它应该是“服务”而不是“服务器”
糟糕，错字已修复。
这对我也有帮助:-)

【解决方案9】：

我正在运行 Angular 9、.net core 3.1 和 VS 2019 Community。升级到最新版本的 Angular 后，我开始解决这个问题。在阅读了其他问题后，我尝试了几个步骤，包括增加超时时间，但没有任何效果。

我为使其正常工作所做的更改是在angular.json 文件中设置"progress" : true。要找到正确的位置，请在serve 下。

 "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "xxx:build",
            "progress": true
          },

【讨论】：

谢谢，先生！

【解决方案10】：

因此，CLI 加载速度不够快，无法让 .net 核心“连接”它。因此，将超时设置为 30 秒，然后等待。尝试刷新几次。我花了 5 分钟以上才能看到一些观点。

【讨论】：