一、创建angular项目
ng new myFirstDemo //angular-cli新建项目
ng g m testm //新建模块
ng g c testm/headertest //新建组件
提示：组件必须到处去
@NgModule({ imports: [ CommonModule ], declarations: [HeadertestComponent], exports: [HeadertestComponent] //新添加的部分 })
二、安装ng-packagr
npm i ng-packagr --save
npm i ng-packagr --save-dev
三、根目录下新建2个文件（和项目名同级的目录）
1. ng-package.json，内容如下：
{ "$schema": "./node_modules/ng-packagr/ng-package.schema.json", "lib": { "entryFile": "public_api.ts" }, "whitelistedNonPeerDependencies": [ "." ] }
2.public_api.ts，内容如下
export * from './src/app/testm/testm.module';
提示：此文件是导出封装的模块。
四、修改package.json文件
"scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "packagr": "ng-packagr -p ng-package.json" //新添加的 }, "private": false, //修改为false
五、删除package.json文件dependences内容，
//下方代码全删除 "dependencies": { "@angular/animations": "^6.1.0", "@angular/common": "^6.1.0", "@angular/compiler": "^6.1.0", "@angular/core": "^6.1.0", "@angular/forms": "^6.1.0", "@angular/http": "^6.1.0", "@angular/platform-browser": "^6.1.0", "@angular/platform-browser-dynamic": "^6.1.0", "@angular/router": "^6.1.0", "core-js": "^2.5.4", "firstdemodiective": "0.0.0", "nv-test-header": "^1.0.5", "rxjs": "~6.2.0", "zone.js": "~0.8.26" }
六、执行打包命令
npm run packagr
提示：项目目录会多一个dist文件夹
七、切换目录到dist文件夹（执行 cd dist）
npm pack
提示：如果npm没有登录，请先去npm官网注册账号，并在根目录执行 npm login，依次输入账号和密码以及邮箱
八、接着七的步骤继续执行npm publish
九、此时组件已经发布到npm官网，你可以登录自己的账号去查看相关信息。
最后补充：我在执行上面操作时，遇到的错误以及排查信息。
1.npm run packagr 执行这句命令时，会报node_modules里面的一堆错误，原因是rxjs的版本号不对。
2.npm pack 执行这句命令时，会报@angular/animations不在白名单什么的错误。这个问题已经解决了，我已在ng-package.json文件加了“whitelistedNonPeerDependencies”的配置。
3.修改组件版本号或者名称等配置信息，只需要在package.json文件修改即可。