内容简介:创建一个Angular库总是一个被关注的话题,随着Angular6的发布,创建库变得更统一和容易. 这篇文章介绍基于新的Angular-Cli来创建Angular的库ng-packagr已集成到angular-cli中,不再需要手动安装配置ng-packagr这个指令做了三件事:
创建一个Angular库总是一个被关注的话题,随着Angular6的发布,创建库变得更统一和容易. 这篇文章介绍基于新的Angular-Cli来创建Angular的库
一.ng-packagr
ng-packagr已集成到angular-cli中,不再需要手动安装配置ng-packagr
二.环境,Angular-Cli 6+
三.创建项目并生成库的Project
yarn global add @angular/cli // 升级到Angular6+ ng new handle-batch-error // 创建新项目 cd handle-batch-error ng g library batch-error // 创建库!! 复制代码
四. ng g library
这个指令做了三件事:
1.创建projects为batch-error的子项目,生成子项目相关联的文件
2.更新angular.json文件,添加build和test类库的配置
3.安装一些用于build库的packages
tips1:
我们新建一个项目(handle-batch-error)后,再ng g library时,通常情况是想要library的名字和项目名相同,但ng g library却不能再命名为相同的名称(即handle-batch-error,事实上是不能和angular.json中的project name相同).
解决办法:改为驼峰命名即handleBatchError,生成的文件及package.json均和项目名(handle-batch-error)相同,而angular.json中生成的项目名为handleBatchError,
五.projects中文件介绍
1.ng-package.json
ng-packagr用来build的配置文件
2.package.json
类库的信息文件.
注意:开发库时,不应该随便用dependencies,而应该用peerDependencies。
3.src\public_api.ts
这是库的entryFile,你需要导出的所有内容都在这里面
export * from './lib/services/batch-error.service'; export * from './lib/batch-error.component'; export * from './lib/batch-error.module'; export * from './lib/constant/component.value'; 复制代码
src内就如同我们正常开发angular项目一样,并无区别
六.build
执行 ng build batch-error --prod,生成dist
tips2:angular.json中可以指定"defaultProject": "batch-error",执行ng build --prod即可
tips3:Angular支持打包生成多种可被使用的方式,具体介绍:
docs.google.com/document/d/… , 需翻墙
cd到dist/batch-error,执行npm publish,发布到npm仓库
七.使用类库
// module中引入类库 import {BatchErrorModule} from 'batch-error'; @NgModule({ imports: [ CommonModule, BatchErrorModule ] }) 复制代码
<!--html中使用组件--> <lib-batch-error [statusId]="statusId"></lib-batch-error> 复制代码
参考文档:
1.Building an Angular Library with the Angular CLI (version 6)
题外话:Vue的组件库打包,我是用的rollup,相当简单的配置,还有什么推荐的吗?
// rollup.config.js import VuePlugin from 'rollup-plugin-vue' export default { input: './src/index.js', output: { file: './dist/bundle.js', format: 'es' }, plugins: [VuePlugin(/* VuePluginOptions */)] } 复制代码
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:- 利用 JavaSE 创建简单 HTTP Server
- docker利用Dockerfile创建镜像,上传docker hub
- iOS App创建证书,添加Appid,创建配置文件流程
- RabbitMQ集群创建
- 创建哈夫曼树
- RabbitMQ集群创建
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Game Engine Architecture, Second Edition
Jason Gregory / A K Peters/CRC Press / 2014-8-15 / USD 69.95
A 2010 CHOICE outstanding academic title, this updated book covers the theory and practice of game engine software development. It explains practical concepts and techniques used by real game studios,......一起来看看 《Game Engine Architecture, Second Edition》 这本书的介绍吧!