Angular CLI Css 注入而不是重新加载

Question

当我运行ng serve 时，如果我对.scss 文件进行更改，它将导致页面重新加载。这很不方便，并且可能会丢失一些状态或开发工具更改。

通常，当我进行设计时，我会使用 browsersyc 之类的东西来注入 css 而无需刷新页面。当我不得不调试一些棘手的事情时，这为我节省了大量时间。

有没有办法让 Angular cli 注入 .scss 更改或重新加载页面？

编辑：

来自 webpack 文档：

HMR 是一项可选功能，仅影响包含 HMR 代码的模块。一个例子是通过样式加载器修补样式。为了使补丁工作，样式加载器实现了 HMR 接口；当它通过 HMR 接收到更新时，它会用新样式替换旧样式。

同样，在模块中实现 HMR 接口时，您可以描述更新模块时应该发生的情况。然而，在大多数情况下，并不是必须在每个模块中编写 HMR 代码。如果模块没有 HMR 处理程序，则更新会冒泡。这意味着单个处理程序可以更新完整的模块树。如果更新树中的单个模块，则重新加载整个依赖项集。

据我所知，Angular-CLI 支持 HMR，但我找不到任何官方文档。

是否可以在 Angular 6 中实现样式加载器？

Answer 1

使用 Angular 7，您可以关注 this guide 以启用 HMR。 （模块热更换）

它与 CSS 注入不同，但它比完全重新加载和编译快很多。

很棒的是它也适用于您的 ts 文件。

---

小附录：

我认为您实际上可以加载通过注入更改的 CSS，但遵循 HMR documentation 的这段代码