typescript 角服务库

vc9ivgsu  于 2023-05-01  发布在  TypeScript
关注(0)|答案(4)|浏览(97)

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

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
imzjd6km

imzjd6km1#

您可以更新主tsconfig.json中的路径

"paths": {
  "library": {
    "dist/library"
  }
}

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

那么你就不需要为你的库启动单独的构建,重建也可以工作。

68bkxrlz

68bkxrlz2#

您在其中生成库的项目充当调试和测试库的宿主。
只需将库导入主机应用程序模块,确保所有依赖项可用并为主机应用程序提供服务。您在库中所做的所有更改都将直接实时重新加载到宿主应用程序中。

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

使用你的官方库名,例如@foo/foo-library,angular会在正确的位置找到它。

m528fe3b

m528fe3b3#

终于找到了解决办法。
首先,我通过以下方式查看库的构建版本(由Angular Cli 6提供)。2):

ng build foo-lib --watch

那么,我的应用程序只是:

ng serve

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

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

然后我的库中的每一个更改都会导致构建版本的更改,并且我的应用程序可以正确地重新加载。
这个过程似乎有点复杂。

4dbbbstv

4dbbbstv4#

一些答案建议ng build mylib --watch你的库,然后ng serve,但我觉得有点笨重。我想通过简单地做ng serve而不做其他事情来运行一些东西。
这是我提出的解决方案,它在Angular 15中运行良好(具有多项目工作空间)。

- libs/common-lib
- projects/firstApp
- projects/secondApp
- tsconfig.json

基本上,我不得不在项目的根目录中修改tsconfig.json

发件人:

"compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "common-lib": [
        "dist/common-lib",
      ]
    },

收件人:

"compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "common-lib": [
        "libs/common-lib/src/public-api",
      ]
    },

相关问题