如何在MVC 5中使用Visual Studio 2015设置angular-cli？

Question

我正在寻找一些关于如何在MVC 5(而不是Core)中使用Visual Studio 2015设置和集成angular-cli(webpack)的最佳实践和说明.

我意识到这里有一个类似的问题(如何在Visual Studio 2015中使用带有ASP.NET Core的Angular-Cli设置asp.net angular 2项目？),但这仅适用于Asp.net Core.由于服务器技术问题,我的项目无法转移到Core.

Answer 1

这是我的解决方案：

1. 保留一个空的index.html

2. 运行 ng build 生成带有注入脚本和样式链接的index.html

3. 创建一个 Gulp/Grunt 任务，将所有脚本和样式链接从 index.html 提取到一个 json 文件（例如 manifest.json）。（这里我使用 Cheerio 和 Gulp-asset-manifest ）
4. 使用 Razor 语法编写逻辑来读取 manifest.json 并输出到 MVC 视图

它非常适合我的 ASP.net MVC 5 项目。

但是，在支持 publicPath 之前，它无法使用路由延迟加载，因为块 js 文件的 url 是从根文件夹而不是 dist 文件夹加载的。

例如：

正确的块js文件应该是：

www.example.com/MyApp/dist/[id].chunk.js

但它将从以下位置加载：

www.example.com/MyApp/[id].chunk.js

我已经创建了一个 PR 来为 angular-cli 添加pulishPath 来解决这个问题。

https://github.com/angular/angular-cli/pull/3285

更新：

publicPath 的 PR 已合并，延迟加载不再是问题。