将 ASP.Net Core Angular 模板从版本 8 更新到 9

Posted 2023-03-27

【中文标题】将 ASP.Net Core Angular 模板从版本 8 更新到 9

【英文标题】：Updating ASP.Net Core Angular template from Version 8 to 9

【发布时间】：2020-06-11 17:56:12

【问题描述】：

我读的这本书从一开始就有第 9 版（ASP.NET Core 3 和 Angular 9 - 第三版），并且还使用了 angular 模板。我已安装了适用于 vs 2019 的最新 Visual Studio 更新。

Angular 项目的模板版本为 8。我读的书是版本 9。所以我尝试更新我的 Angular 版本。 ng update给我

@angular/cli 8.3.14 -> 9.0.3 ng update @angular/cli

@angular/core 8.2.12 -> 9.0.3 ng update @angular/core

@nguniversal/aspnetcore-engine 8.1.1 -> 8.2.6 ng update @nguniversal/aspnetcore-engine

我更新了 cli 和 core。但是当我尝试更新我得到的第三个包时：

C:\Users\user\Test\ClientApp>ng update @nguniversal/aspnetcore-engine
Using package manager: 'npm'
Collecting installed dependencies...
Found 39 dependencies.
Package '@nguniversal/aspnetcore-engine' is not a dependency.

我还是尝试运行该应用程序，但我得到了 html

Cannot GET /

或带有以下内容的异常页面：

System.TimeoutException: The Angular CLI process did not start listening for requests within the timeout period of 0 seconds. Check the log output for error information.
   at Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.WithTimeout[T](Task`1 task, TimeSpan timeoutDelay, String message)
   at Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.PerformProxyRequest(HttpContext context, HttpClient httpClient, Task`1 baseUriTask, CancellationToken applicationStoppingToken, Boolean proxy404s)
   at Microsoft.AspNetCore.Builder.SpaProxyingExtensions.<>c__DisplayClass2_0.<<UseProxyToSpaDevelopmentServer>b__0>d.MoveNext()
--- End of stack trace from previous location where exception was thrown ---
   at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)

【问题讨论】：

try -> dotnet run l 然后导航到 localhost:5000

【参考方案1】：

也许有点晚了，但也许这对其他人有帮助。我遇到了完全相同的问题。 要使其正常工作，请在 package.json 中执行此操作。

改变

"scripts":
   ...
   "start": "ng serve"
   ...

 

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

 

这取自Smatusan 的评论。这就是 explanation 的工作原理。

“由于 ng serve 的初始构建时间超过了 .NET SPA 服务的编程超时窗口，因此经常出现此问题，因此通过给它回显，.NET SPA 服务接收到一些数据并认为它已连接。 " - mikejunt.

GitHub 上的完整问题可以在Angular 和.NET 方面找到

【参考方案2】：

当我将 Angular 版本升级到 11 并且仍在运行 .net core 3.1 时，我遇到了类似的问题。

我是如何解决的：

已完成 Angular 更新（确保节点模块也是最新的） 安装了.Net core 5.0 右键解决方案->属性->应用程序：目标框架下拉菜单（更改为最近安装的5.0） 保存更改 管理 Nuget 包 -> 将 Microsoft.AspNetCore.SpaServices.Extensions 更新到版本 5+

然后我就可以正常启动调试会话了。

【参考方案3】：

当将 Angular 从 v8 升级到 v9 时，'ng update' 在 main.ts 中添加这一行

export  renderModule, renderModuleFactory  from '@angular/platform-server';

去掉就好了，上面的错误就没有了，看看这个link