使用 npm 链接的 Angular 10.x 库开发在热重载时不显示浏览器中的 html/css 更改

Question

我已经使用 cli 创建了一个 Angular lib (mylib)，并使用 dist 目录中的 npm link 创建了一个符号链接。

我使用 cli 创建了一个 Angular 应用程序，并使用 npm link mylib 链接了 lib。

我能够从应用程序使用 mylib 并在应用程序中使用组件、服务等。

在 lib 上运行“ng build --watch”并在应用程序上运行“ng serve”后，如果我对 lib 中的 .ts 文件进行更改并保存，lib 将重建，然后应用程序将重建和这些更改反映在应用程序中。

但是，如果我对 lib 中的 html 或 scss 文件进行更改，它将构建，然后应用程序将重新构建，但这些更改不会反映在应用程序中。“ng serve”窗口确实显示vendor.js“chunk”发生了变化，但它也显示“警告没有发出任何文件”。紧随其后。我应该补充一点，即使模板/样式是内联的（在 ts 组件文件中），它仍然不会反映这些更改。

当我使用 chrome 开发工具并查看源代码时，vendor.js会更新为模板的最新更改以及组件的样式参数。

我可以显示更改的唯一方法是终止 ng serve 并再次运行它。

Windows 10、Angular 10、NPM 6.14.10、Node 14.15.4

提前致谢！

Answer 1

如果您更新 tsconfig.json 中的路径，它将获取更改。我不知道这对已发布的版本有什么影响。我没有测试过。

我有一个名为“core”的库，我的路径如下所示。

  "paths": {
    "core": [
      "projects/core/src/core-api",
      "dist/core/core",
      "dist/core"
    ],
},

“core-api”是我导出组件、服务和模块的地方。使用 Angular cli 时的默认名称是“public-api”。