Angular6 构建并发布自己的npm包到私有库

因为公司业务需求，需要搭建一个公司内部使用的npm私有库，来管理自己封装的angular组件包，搭建的方法参考掘金的基于Docker搭建CNPM私有仓库，下面说一下如何打包并上传到npm库

新建library

创建一个ng项目，来管理和发布组件，运行命令

ng new <project name>

搭建完项目之后，进入项目根目录，运行命令创建一个library库，prefix是组件前缀(如 nz-zorro 的组件前都是 nz-xxx)

ng g library <package name> --prefix <prefix name>

运行完命令之后，项目下会多一个projects的目录，里面有我新建的@zzj/test，因为我package name里面加了@zzj/所以组件目录会有两层

在/src/lib/目录下，把自己封装的组件拷贝进来

自定义组件输出

我们可以在public_api.ts文件中，配置我们想要暴露出来的组件和服务，并且可以给component，service，module定义别名

打包并发布

组件完成后，在项目根目录下运行打包命令

ng build <package name>

这时我们的组件就打包好了，在根目录下会生成一个dist文件夹，里面就有我们打包好的

打包之前先将npm 注册到自己的私有npm库

npm config set registry=http://172.16.4.5:7001   

cd到打包好的组件目录下，运行发布命令

cd ./dist/zzj/test/

// 发布
npm publish

这时我们的组件就已经发布到我们的私有npm库上了

组件安装

在项目中运行命令安装依赖，就可以使用我们自己npm包了

npm install @zzj/test

组件依赖的第三方库

在很多情况下我们的组件可能会依赖特定的环境和第三方库，我们可以通过配置package.json在安装组件的同时安装依赖的其他组件，比如组件是使用了ng-zorro-antd的UI组件，那么就可以在peerDependencies中添加ng-zorro-antd的版本，这样在npm install私有包的同时会检查项目中是否已安装ng-zorro-antd库，如果没有则会一起安装