在angular 中使用 npm link

最新推荐文章于 2022-06-13 20:43:01 发布

lionheart922

最新推荐文章于 2022-06-13 20:43:01 发布

阅读量636

点赞数

分类专栏： Angular学习

本文链接：https://blog.csdn.net/lionheart922/article/details/112647881

版权

本文介绍如何在Angular项目中创建一个本地library作为公共模块，并通过npm link进行引用。在创建过程中，需要在ng-package.json中添加白名单避免编译错误，同时更新tsconfig.json的paths配置以解决运行时的依赖问题。完成这些步骤后，可以在其他Angular应用中顺利引用并调试这个公共library。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需求是，需要在本地创建一个 angular 的 library，作为公共模块，然后在其他application中引用它

创建angular公共library

ng new my-workspace --create-application=false
cd my-workspace
ng generate library my-lib

在common library 的项目里的package.json里需要在dependencies引用第三方包的情况下必须在， ng-package.json里加白名单，要不然编译会报错,然后在做npm link的时候该common-libraries下会生产node_modules, 或者直接在devDependencies下加，在npm link的时候不会报错，但是要在tsconfig.json里加上对应的paths.

package.json

{
  "name": "ng-libraries",
  "version": "0.0.1",
  "peerDependencies": {
    "@angular/animations": "~9.1.12",
    "@angular/common": "~9.1.12",
    "@angular/compiler": "~9.1.12",
    "@angular/core": "~9.1.12",
    "@angular/forms": "~9.1.12",
    "@angular/platform-browser&#

最低0.47元/天解锁文章