Question

我将我的.NET Core 2.1项目升级到Angular 6，除了热更新外，一切似乎都正常工作。在更新之前，可以更新TypeScript，VS会重新编译并重新加载浏览器，现在这似乎已被打破，必须手动运行ng build来重新编译脚本，VS似乎不会自动重新编译了。

是否有设置，可能在angular.json中我需要设置以启用开发服务器？

更新

由于某种原因，Hot Updates暂时开始工作，不知道我做了什么让它开始/停止工作。当我启动调试会话并更新任何.ts文件时，我可以看到编译器输出成功，但是当我刷新浏览器时，我看不到任何更改，除非我使用ng build手动构建项目

我开始认为在某个地方发生了一些错误传达，或者某个地方可能出现错误而导致某些内容无法更新？

我在观看输出窗口时注意到的另一件事是我的网站开始在localhost：44359上运行，但在输出中，如果这些端口匹配，它会显示Angular Live Development Server is listening on localhost:55287吗？

我做的最后一个观察是在调试会话期间进行了更改后，输出窗口列出了所有块，就像手动运行时一样，但输出i ∩╜ówdm∩╜ú: Compiled successfully可能会导致某些内容损坏或者这是只是输出错误？

Answer 1

经过一番混乱之后，我终于开始工作了，以为我会分享发生的事情。

运行ng build时，它会编译并输出到ClientApp/dist文件夹中。当您启动调试会话时，您的项目使用此版本。如果在运行时更改文件，它将重新编译文件，但不会覆盖dist目录中的已编译文件。我认为因为文件是在UI外部手动生成的，所以VS认为它不能覆盖它们。

因此，如果幸运的是，您遇到一个简单的问题就很容易解决，只需删除ClientApp/dist文件夹，然后再开始调试会话即可。 Visual Studio将在后台编译文件，并且当您更新源文件或样式表时，浏览器应自动刷新。

更新

我发现的另一件事是，如果您需要手动运行ng build，则还有另一种方法可以使文件至少保持最新（需要重新加载）：

package.json

   "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "debug": "ng serve --watch",
  },

然后运行ng build --watch而不是ng build，这将使提示进入监视模式（按ctrl c键结束），然后每次更改其中一个源文件时，它将更新。我添加了“调试”，是因为我不确定它是否会干扰生产，如果可以备份的话，始终可以保持现有状态或默认状态。

然后在Startup.cs（Configure（…））中更新服务器以使用新的“调试”：

spa.UseAngularCliServer(npmScript: "debug");

更新-2

我在使用Angular和VS（2017）时发现的另一件事是，如果您碰巧在cli编译器未拾取的代码中出现错误，尤其是在任何构造函数或ngOnInit（）中函数，即使关闭后它也会挂断Angular Service，这使得热更新似乎不再起作用。这将导致完全的Madness，因为在关闭服务之前，不会加载任何更改或更新。

另一个可能的原因是编译.scss或Angular时出错。在“输出”窗口中检查是否有任何Angular-cli错误或在浏览器输出中。

关闭VS后，请确保VSCompiler.exe，任何额外的Console Windows Host（Angular Server，而不是在SQL用户下运行的服务器，即MSSQLFDLauncher ...）和所有Visual Studio服务都已关闭您的任务管理器。

我意识到这实际上是我的代码中的错误，导致一切停止工作或根本无法工作。 Angular和.NET不会总是抛出错误，有时有时会跳过这些错误（尤其是在出现语法错误时），或者在所有其他输出中间输出该错误。

很有可能停止运行，这是由于错误或其他原因导致编译器停止响应。最后要检查的区域是package.json和angular.json，尤其是任何路径，然后运行以下命令并密切注意输出以进行需要进行的更新：

ng update 
npm update
npm rebuild
npm install

默认的.json文件应直接从软件包中工作，请尝试恢复为默认文件以检查您的配置。删除dist文件夹基本上是上述操作的快捷方式（减去实际输出，让VS在Debug之前进行编译），强制用角度重新编译所有内容，但请记住，如果服务已挂起，则没有关系在该服务停止之前您要做什么。

Answer 2

简短回答。

删除ClientApp文件夹中的“ Dist”文件夹。在VisualStudio中

和 重新启动 和运行

Answer 3

我通过了同样的问题。

您有两个选择：

删除“ dist”文件夹（每次使用“ ng-build”都会重新创建该文件夹）
使实现等于下面的链接。此实现使应用程序忽略dist文件夹。它将仅在生产环境中使用。

Implementation

我认为第二种解决方案更好，因为您不必每次调试应用程序时都删除“ dist”文件夹。

开发服务器热更新无效

更新

3 个答案:

更新

package.json

更新-2