本例创建一个天气组件
代码语言：javascript复制ng new weatherwidget --createApplication=false选择不要路由
选择scss
cd weatherwidget用vs code打开本项目
创建组件库weather
代码语言：javascript复制ng generate library weather现在我们需要创建一个项目来测试这个库
代码语言：javascript复制ng generate application weathertest在angular.json文件中可以看到三个项目
然后你可以随心所以的对weather项目做修改以达到你希望的组件效果，因为是教你如何发布组件的课程，在这里我们就演示如何具体修改你的组件本身了。
在项目根目录下的package.json文件上上增加一条命令
执行命令
代码语言：javascript复制npm run weatherbuild在dist目录生成了编译好的文件
现在在weathertest项目中对weather组件进行试用
因为在tsconfig.json中有设置weather的路径 这里的是可以直接引用WeahterModule的
把app.component.html的内容改为
代码语言：javascript复制<lib-weather></lib-weather>现在测试一下效果
代码语言：javascript复制ng serve weatherteset
有三种方式可以将组件库导入到你的项目中使用
第一种作为tar file添加都项目目录中
代码语言：javascript复制cd dist/weather/
npm packtar文件被生成了
回到你的项目目录下安装tar包
代码语言：javascript复制npm install ./dist/weather/weatherweather-0.0.1.tgz安装完毕后可以看到package.json中生成了相关的信息
去除tsconfig.json中关于weather的配置内容之后 我们看看项目是否能运行正常，如果可以说明调用成功
第二种方式是发布npm包
首先修改weather项目中的package.json文件中的配置 这些配置会体现在将来发布的npm包中
重新更新项目根目录下package.json文件中的配置
如果你想把组件发布到私有的npm仓库中 可以选择使用verdaccio https://github.com/verdaccio/verdaccio
代码语言：javascript复制npm install -g verdaccio
verdaccio
打开http://localhost:4873/ 可以看到
我们先尝试把组件发布到私有的npm库中 这样设置即可
执行发布命令前 我们先注册一下用户
代码语言：javascript复制npm adduser --registry http://localhost:4873按要求设置一下用户名和密码 邮箱等
然后再执行发布命令
代码语言：javascript复制npm run weatherbuild
发布成功！ yeah！
刷新私有库地址发现了新发布的库
现在尝试在项目中安装weather库
代码语言：javascript复制npm install @liuyi/weather --registry http://localhost:487
3 --save
手动移除package.json文件中 之前tar file方式引入的设置
再次测试项目是否能正常运行
第三种方式就是把库发布到公共的npm库中，发布步骤和第二种方式相似 可参考 https://my.oschina.net/lilugirl2005/blog/2999467
如果你发布到公共npm上出现了问题可以参考 https://github.com/XXHolic/segment/issues/28
