Visual Studio 2017中运行Angular应用时，编辑HTML文件能否实时生效？

嘿，作为曾经踩过VS2017 Angular模板坑的过来人，给你分享几个能快速解决问题的实用方法：

一、搞定启动耗时久的问题 #

默认模板启动时会先完整构建Angular项目再启动后端，每次调试都重复这个流程自然慢得让人着急，咱们可以拆分前后端启动步骤：

• 先单独启动Angular开发服务器：打开命令行，进入项目里的ClientApp文件夹，运行npm start（这个命令会启动Angular自带的热重载服务器，默认端口是4200）
• 再在VS里启动后端调试：右键项目→属性→调试，把「启动浏览器」的URL改成http://localhost:4200，这样VS启动后端后会直接打开Angular的页面，而且后端不用再负责构建前端，启动速度会快一大截。

二、实现Angular HTML文件实时刷新 #

默认模板的构建方式是每次修改都重新打包整个前端，自然没法实时刷新，改成用Angular官方的开发服务器就能完美解决：

1. 配置API代理：在ClientApp里新建proxy.conf.json文件，内容如下（把后端的URL换成你实际的调试地址）：

{
  "/api/*": {
    "target": "https://localhost:5001",
    "secure": false,
    "changeOrigin": true
  }
}

2. 修改启动脚本：打开ClientApp/package.json，把start脚本改成：

"start": "ng serve --proxy-config proxy.conf.json"

3. 启用热模块替换（可选）：如果想要更高效的刷新（不用整个页面重载），可以在angular.json里找到serve配置，添加"hmr": true，然后启动命令改成ng serve --proxy-config proxy.conf.json --hmr，记得提前安装HMR依赖：npm install @angularclass/hmr --save-dev

这样操作之后，你修改任何Angular的HTML、组件代码，页面都会实时同步变化，而且启动速度也会大幅提升，不用每次都等VS重新构建前端啦。

另外还有几个小优化点可以试试：

• 关闭VS调试时的「JavaScript调试」（项目属性→调试→取消勾选），如果不需要调试前端JS的话，能进一步加快启动速度
• 定期清理node_modules然后重新npm install，避免依赖缓存导致的构建异常或缓慢

内容的提问来源于stack exchange，提问作者musefan