Angular 为图书馆服务

Angular serve library

在最新版本的Angular cli中,我们可以使用ng g library lib-name命令来创建库。如Angulardocs中所述:

ng serve <project>

并且:

<project>   The name of the project to build. Can be an app or a library.

所以,我们可以为图书馆服务。但是当我发球时出现以下错误:

Project 'ngx-tab-component' does not support the 'serve' target.
Error: Project 'ngx-tab-component' does not support the 'serve' target.
at ServeCommand.initialize (C:\Users\vahidnajafi\angular\ngx-tab-app\node_modules\@angular\cli\models\architect-command.js:53:19)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
at Function.Module.runMain (module.js:695:11)
at startup (bootstrap_node.js:191:16)
at bootstrap_node.js:612:3

您生成库的项目作为调试和测试它的宿主。

只需将您的库导入主机应用程序模块,确保所有依赖项都可用并为主机应用程序提供服务。您在库中所做的所有更改都会直接实时重新加载到您的主机应用程序中。

注意: 您必须导入 projects/foo-lib/src/public_api,而不是 'dist/foo-lib',但

使用您的官方图书馆名称,例如 @foo/foo-library,angular 会在正确的位置找到它。

终于找到解决办法了。

首先,我通过以下方式查看库的构建版本(由 Angular Cli 6.2 提供):

ng build foo-lib --watch

然后我通过以下方式简单地提供应用程序:

ng serve

然后我从 dist 目录导入模块(因为我可以观看构建版本):

import { FooLibModule } from 'dist/foo-lib';

然后我的库中的每一个变化都会导致构建版本的变化,我的应用程序可以正确地重新加载。

过程好像有点复杂

您可以从

更新主要 tsconfig.json 中的路径
"paths": {
  "library": {
    "dist/library"
  }
}

"paths": {
  "library": {
    "projects/library/src/public-api"
  }
}

那么你不需要为你的库开始单独的构建,重建也可以。