带有热模块替换的 ASP.NET 核心中的 Angular CLI答案

【问题标题】：Angular CLI in ASP.NET core with hot module replacement带有热模块替换的 ASP.NET 核心中的 Angular CLI
【发布时间】：2018-03-31 14:04:03
【问题描述】：

我们希望在 ASP.NET 核心中的项目中使用 Angular CLI。作为输出，我们选择 wwwroot 而不是 dist。默认的 ng serve 会自动启用热模块替换。但是现在我们需要通过 kestrel 和 iis 集成来进行热模块替换。我们决定不使用 AspNet 核心 Javascriptservices，因为我们想使用 Angular CLI 作为默认值。

有谁知道如何使用 Angular CLI 和 ASP.NET 核心标准主机环以及 wwwroot 中的静态文件启用热模块替换？

【问题讨论】：

对此也绝对感兴趣。你有没有找到解决方案 stephan.peters？
我们将使用 Angular cli 来托管客户端应用程序（js、CSS、html...），并在本地主机上使用 iis kestrel for web api，并启用 2 个不同的端口和 cors。因此，我们不再寻求两者之间的深度整合。

标签： asp.net-core angular-cli asp.net-core-mvc-2.0

【解决方案1】：

我可以通过这些步骤运行 angular cli。

确保您的系统上安装了最新的typescript。
在 Visual Studio 2017 中创建 asp.net core angular 模板项目。
现在用npm-check-updates更新所有npm包
安装 npm 包

npm install
全局安装 angular/cli

npm install @angular/cli@latest -g
在本地安装 angular/cli

npm install @angular/cli@latest --save-dev
使用这个命令在你的主项目之外的任何临时位置创建一个角度项目：

ng new hello-world
现在，转到项目目录并将.angular-cli.json 文件复制到主 dot net core 项目的根目录中。然后你必须编辑这部分文件：

"root" : "src"改成"root" : "ClientApp"

一切都搞定了！

现在，转到您项目的组件目录：

cd ClientApp/app/components

并在终端的组件目录中制作您的组件：

ng g c MyComponent --module='app.module.browser.ts'

【讨论】：

你可以在同一端口上的 IIS kestrel 上运行 ng serve（webpack 开发服务器）和 Web Api。我不这么认为......这个问题不是你是否可以将angular cli项目结构放在Asp.net Core项目中。

【解决方案2】：

答案是我们必须在本地主机环境上接受开发时有2个本地主机服务器一起运行。 ng serve 与 webpack 开发服务器一起用于客户端代码（角度应用程序），iis express 与 kestrel 用于 web api 或 MVC ......这样你可以使用 ng serve 的热模块替换。

【讨论】：