常见一个npm-angular组件

创建一个angular 应用

ng new <workspace-name> --create-application=false

--create-application=false 阻止默认生成一个angular项目

其实不一定要用这种方式, 我感觉我们可以直接新建一个库, 然后进行开发后面进行打包

创建一个Angular 库

ng generate library <project-name>

删除掉一些测试文件

angular.json添加

"schematics": {
        "@schematics/angular:component": {
          "style": "scss",
          "skipTests": true
        },
        "@schematics/angular:application": {
          "strict": true
        },
        "@schematics/angular:directive": {
          "skipTests": true
        },
        "@schematics/angular:modules": {
          "skipTests": true
        },
        "@schematics/angular:pipe": {
          "skipTests": true
        },
        "@schematics/angular:service": {
          "skipTests": true
        },
        "@schematics/angular:class": {
          "skipTests": true
        }
      },

打包

ng build <project-name> 
输出文件在dist/<project-name>

发布

使用命令导航到项目 dist 文件夹cd dist/<project-name>

npm publish

登录

npm login
yl123
xxx
xxx@qq.com
输入邮箱的验证码

npm whoami // 可以查看当前登录的npm用户

如果使用cnpm

npm config get registry // 先康康你的是否是npm官方的源，不是请切回
npm config set registry https://registry.npmjs.org

更新

代码如果有更新,publish的时候需要更改版本号的，否则也提交不到。方式两种如下

1. 直接改package.json

2. npm指令操作package.json

   npm version patch  //补丁版本,最后一位数加1 
   npm version minor  //增加了新功能 中间的数字加1
   npm version major //大改动,不向下兼容 第一位数字加1