升级Angular 5后Visual Studio 2017 ASP.Net Core Angular项目无法正常运行

一、那篇文章里的修改是正确的吗？ #

答案是肯定的，这个修改完全合理。
原来的<app asp-prerender-module="ClientApp/dist/main-server">Loading...</app>里的asp-prerender-module是ASP.NET Core用来做Angular服务器端预渲染的标签助手——它会调用指定的服务器端打包文件（main-server.js）来生成初始页面HTML。但你现在用IIS Express本地测试，大概率没配置好服务器端预渲染（或者升级后这个打包文件的路径、配置出了问题），继续保留这个属性的话，应用会尝试加载一个无法正常工作的预渲染模块，自然就卡在"Loading..."了。
换成<app>Loading...</app>后，Angular的客户端打包文件就能正常接管这个标签，完成应用的初始化渲染。

二、如果修改后还是不行，可能还有这些问题要排查 #

如果改完还是只显示加载文本，建议从这几个方向检查：

• 客户端打包文件没加载成功
  按F12打开浏览器开发者工具，切换到Network标签，看看main.js、polyfills.js这些Angular核心文件有没有成功加载。要是出现404错误，得确认：

  • Angular编译后的文件是不是在ClientApp/dist目录下，路径有没有错
  • IIS Express的静态文件配置是不是允许访问这个dist目录

• Angular初始化时报错了
  看看Console标签里有没有JavaScript错误。常见的情况有：

  • 升级Angular 5时，依赖包版本不兼容（比如RxJS、Zone.js的版本得跟Angular 5匹配）
  • 原有代码里用了Angular 5已经废弃或修改的API，导致初始化失败

• 路由配置出问题
  如果你的Angular应用用了路由，要确认默认路由指向的组件存在，而且路由模块已经正确导入到根模块里。要是默认路由配错了，页面可能就没内容渲染。

• ASP.NET Core的静态文件中间件没配置好
  去Startup.cs里看看，有没有正确添加静态文件中间件：

  app.UseStaticFiles();
  

  还要确保这个中间件能正确映射到Angular编译后的dist目录，让IIS Express能正确返回静态文件。

内容的提问来源于stack exchange，提问作者Ivan-Mark Debono