网站建设与推广综合实训总结,wordpress自豪地,物流网站给做软件,做网站 郑州公司1. 准备组件 2. 创建打包文件夹及部分配置文件 创建 文件夹app-legalentities-root拷贝组件源文件到新的文件夹app-legalentities中创建文件 .npmrc
registry发布地址always-authtrue创建文件 ng-package.json
{$schema: ./node_modules/ng-packagr/ng-pac…1. 准备组件 2. 创建打包文件夹及部分配置文件 创建 文件夹app-legalentities-root拷贝组件源文件到新的文件夹app-legalentities中创建文件 .npmrc
registry发布地址always-authtrue创建文件 ng-package.json
{$schema: ./node_modules/ng-packagr/ng-package.schema.json,lib: {entryFile: public_api.ts}}创建文件 package.json
{name: xxx-xx-test,version: 0.0.9,scripts: {ng: ng,test: ng test,packagr: ng-packagr -p ng-package.json},private: true,dependencies: {angular/animations: ^18.0.0,angular/common: ^18.0.0,angular/compiler: ^18.0.0,angular/core: ^18.0.0,angular/router: ^18.0.0,ng-zorro-antd: ^18.0.1,raise-ssh-test: file:,rxjs: ~7.8.0,tslib: ^2.3.0,zone.js: ~0.14.3},devDependencies: {angular/animations: ^18.0.0,angular/common: ^18.0.0,angular/compiler: ^18.0.0,angular/core: ^18.0.0,angular/router: ^18.0.0,rxjs: ~7.8.0,tslib: ^2.3.0,zone.js: ~0.14.3}
}
创建文件 public_api.ts
export * from ./app-legalentities/app-legalentities.component;
export * from ./app-legalentities/app-legalentities.service;3. 修改配置文件
修改 public_api.ts以下内容为导出的模块、service、modal等
export * from ./app-legalentities/app-legalentities.component;
export * from ./app-legalentities/app-legalentities.service;修改 package.json
name: app-legalentities-root, // 当前组件打包文件夹名称version: 0.0.1, // 当前组件版本每次发布后下次发布前版本号1scripts: {...},dependencies: {angular/animations: ^18.0.0, // 公共angular/common: ^18.0.0, //公共angular/compiler: ^18.0.0, //公共angular/core: ^18.0.0, //公共angular/router: ^18.0.0, //公共ng-zorro-antd: ^18.0.1, // 当前组件依赖包rxjs: ~7.8.0, //公共tslib: ^2.3.0, //公共zone.js: ~0.14.3 //公共},4. down依赖包和安装打包指令
使用npm i 安装包 执行 npm i ng-packagr //安装打包命令
npm i ng-packagr配置 package.json 文件,删除 dependencies 和 devDependencies中的内容
{name: app-legalentities-root, // 修改打包的名字version: 0.0.2, // 版本号 1scripts: {ng: ng,test: ng test,packagr: ng-packagr -p ng-package.json //配置打包命令},private: false // 这个要修改为false下面的图忘记改了
}5. 打包开始-生成dist文件
执行 npm run packagr 生成dist文件
npm run packagr进入dist 文件目录-执行 npm pack 生成一个压缩文件
npm pack6. 安装vsts-npm-auth和配置
在app-legalentities-root文件夹下 安装 vsts-npm-auth
npm install -g vsts-npm-auth --registry https://registry.npmjs.com --always-auth false在dist根目录下创建文件.npmrc内容同2.3在dist文件夹中配置vsts-npm-auth
vsts-npm-auth -config .npmrc7. 发布打包文件
执行指令 npm publish
npm publish8. 引入自定义组件 在使用组件的根目录下即跟package.json同级创建文件.npmrc内容同2.3 安装组件 npm i app-country-select0.0.1
npm i app-country-select0.0.1遇到的问题
‘npm run packagr’ 打包报错了 解决方案将 angular框架的 app-legalentities-root文件夹移到单独的位置首先删除已经安装好的依赖包然后执行第四步
