创建一个 angular 库并在我的 angular 项目中本地使用它
creating an angular library and using it locally with my angular project
我正在尝试 Angular 9,我想创建一个项目,然后创建一个库项目并开始向其中添加我想稍后在 [=63 上发布的通用模块=],并在我的项目中本地使用这些库。
相关依赖如下:
Angular CLI: 9.0.0-rc.6
Node: 13.3.0
OS: MacOS 10.15.2
PNPM: 4.3.0
首先,我使用 ng new foo
创建了我的 angular 项目,并向其中添加了 angular material 依赖项 ng add @angular/material
然后我用 ng new tuxin-ec --create-application=false
创建了我的图书馆项目
在里面我执行了 ng generate library animated-images --prefix=tuxin-ec
.
我打算创建大约 15 个公共库以供使用和发布。这是这样做的方法吗?只是为每个人做 ng generate library
?
目前在tuxin-ec
项目目录的projects下我有animated-images
包含模块,服务和控制器,我将相关代码添加到控制器html和css.
我想在我的项目中本地 link tuxin-ec
。
所以在tuxin-ec
根目录下我运行pnpm link
在 foo
目录下我 运行 pnpm link tuxin-ec
.
在 node_modules
目录的 foo
下我也有 tuxin-ec linked 目录。
问题是我想做import {AnimatedImagesModule} from 'tuxin-ec
但它抱怨找不到 tuxin-ec
我能做的是 import {AnimatedImagesModule} from 'tuxin-ec/dist/animated-images'
但即便如此,当我尝试在我的项目中导入 AnimatedImagesModule
时,我仍会收到 class AnimatedImagesModule is not an angular module
.
错误
有什么方法可以达到我的预期效果吗?
谢谢!
所以我在谷歌上搜索了一些,发现了以下精彩教程:https://willtaylor.blog/complete-guide-to-angular-libraries/
然后我明白我没有 link 我的整个项目,我 link 特定的模块,这实际上很有意义 :)
所以在 dist/animated-images 目录中我应该执行 npm link
然后在我的项目中我应该执行 npm link animated-images
。而已!很简单!
我正在尝试 Angular 9,我想创建一个项目,然后创建一个库项目并开始向其中添加我想稍后在 [=63 上发布的通用模块=],并在我的项目中本地使用这些库。
相关依赖如下:
Angular CLI: 9.0.0-rc.6
Node: 13.3.0
OS: MacOS 10.15.2
PNPM: 4.3.0
首先,我使用 ng new foo
创建了我的 angular 项目,并向其中添加了 angular material 依赖项 ng add @angular/material
然后我用 ng new tuxin-ec --create-application=false
创建了我的图书馆项目
在里面我执行了 ng generate library animated-images --prefix=tuxin-ec
.
我打算创建大约 15 个公共库以供使用和发布。这是这样做的方法吗?只是为每个人做 ng generate library
?
目前在tuxin-ec
项目目录的projects下我有animated-images
包含模块,服务和控制器,我将相关代码添加到控制器html和css.
我想在我的项目中本地 link tuxin-ec
。
所以在tuxin-ec
根目录下我运行pnpm link
在 foo
目录下我 运行 pnpm link tuxin-ec
.
在 node_modules
目录的 foo
下我也有 tuxin-ec linked 目录。
问题是我想做import {AnimatedImagesModule} from 'tuxin-ec
但它抱怨找不到 tuxin-ec
我能做的是 import {AnimatedImagesModule} from 'tuxin-ec/dist/animated-images'
但即便如此,当我尝试在我的项目中导入 AnimatedImagesModule
时,我仍会收到 class AnimatedImagesModule is not an angular module
.
有什么方法可以达到我的预期效果吗?
谢谢!
所以我在谷歌上搜索了一些,发现了以下精彩教程:https://willtaylor.blog/complete-guide-to-angular-libraries/
然后我明白我没有 link 我的整个项目,我 link 特定的模块,这实际上很有意义 :)
所以在 dist/animated-images 目录中我应该执行 npm link
然后在我的项目中我应该执行 npm link animated-images
。而已!很简单!