发包成功啦！开心～
- npm地址
- github源码
(十) 组件包发布到NPM
配置package.json
本来需要配置.npmignore配置文件，但是网上不建议用这种方式，说是黑名单的方式，不在黑名单里的关键信息都发上去了。
而是建议使用package.json里配置白名单的方式。于是将package.json配置如下： 关键配置处加上了备注信息：
{ "name": "xingorg1-ui", # 组件库名称 "version": "1.0.0", # 版本号（下边讲述自动进行版本提升） "description": "A Component Library for Vue3.js.", # "private": true, # 这个要删掉，不然发布不了 "main": "./dist/xingorg1.umd.min.js", # 引入组件后的入口文件 "files": [ # npm发包白名单，标注哪些会被发布 "dist", "packages", "README", "CHANGELOG", "LICENSE" ], "scripts": { "dev": "npm run serve", "serve": "vue-cli-service serve", "build": "vue-cli-service build --target lib --name xingorg1 ./packages/index.js && vue-cli-service build --xingorg1 --no-clean", "test:unit": "vue-cli-service test:unit", "test:ui": "karma start", "lint": "vue-cli-service lint", "docs:dev": "vitepress dev docs", "docs:build": "vitepress build docs" }, "repository": { # 仓库地址 "type": "git", "url": "git+https://github.com/xingorg1/xingorg1-ui.git" }, "homepage": "", # 页面主页（待创建docs后发布到gh-pages "keywords": [ "xingorg1", "vue3", "components" ], "author": "guojufeng", # 作者 "license": "MIT", # 开源协议 "bugs": { # bugs地址 "url": "https://github.com/xingorg1/xingorg1-ui/issues" }, "dependencies": { "core-js": "^3.6.5", "vue": "^3.0.2" }, "devDependencies": { "@vue/cli-plugin-babel": "^4.5.8", "@vue/cli-plugin-eslint": "^4.5.8", "@vue/cli-plugin-unit-mocha": "^4.5.8", "@vue/cli-service": "^4.5.8", "@vue/compiler-sfc": "^3.0.2", "@vue/eslint-config-prettier": "^6.0.0", "@vue/test-utils": "^2.0.0-beta.7", "babel-eslint": "^10.1.0", "babel-plugin-component": "^1.1.1", "chai": "^4.2.0", "eslint": "^6.8.0", "eslint-plugin-prettier": "^3.1.4", "eslint-plugin-vue": "^7.1.0", "html-webpack-plugin": "^4.5.0", "karma": "^5.2.3", "karma-chai": "^0.1.0", "karma-chrome-launcher": "^3.1.0", "karma-mocha": "^2.0.1", "karma-sourcemap-loader": "^0.3.8", "karma-spec-reporter": "0.0.32", "karma-webpack": "^4.0.2", "lint-staged": "^9.5.0", "mocha": "^8.2.0", "prettier": "^1.19.1", "sass": "^1.28.0", "sass-loader": "^8.0.2", "vitepress": "^0.7.1" }, "gitHooks": { "pre-commit": "lint-staged" }, "lint-staged": { "*.{js,jsx,vue}": [ "vue-cli-service lint", "git add" ] }, "engines": { # 环境与版本要求 "node": ">=8.9.1", "npm": ">=5.5.1" }, "browserslist": [ # 浏览器支持 "last 3 Chrome versions", "last 3 Firefox versions", "Safari >= 10", "Explorer >= 11", "Edge >= 12", "iOS >= 10", "Android >= 6" ]}包名检查
为了防止你package.json里配置的name属性值（也就是包名）已经存在于市面上，所以需要先去NPM官网搜索一下，没有重名的包才能发布成功，否则后期不能发布。
image.png
当前文件下打开CMD
待发布的文件包根目录下，打开命令行工具。
删除淘宝镜像
去掉npm的淘宝镜像，因为发包是要发到npm上，而不是发到npm的淘宝镜像上：
npm config delete registry
image.png
NPM注册or登陆账号
adduser
或者用该命令方式注册：
npm addUser
我的账号：xing.org1
我的密码：********
我的????：outlook邮箱 （据说搜狐邮箱不行，可能没充钱？）
login登陆
login是addUser的一个别名，也可以使用下边的命令
npm login
同上：
版本信息查看
npm version
版本管理——版本提升
npm version “xxx” # xxx特别说明如下
xxx 为具体可用命令
- major: 主版本号
- premajor: 预备主版本
- minor: 次版本号
- preminor: 预备次版本
- patch: 修订号
- prepatch: 预备修订版
- prerelease: 预发布版本
比如想升级一个此版本号，执行命令
npm version minor
各命令操作明细表
help | npm version --help | version命令概览 | ||
version | npm version | 查看当前包的详细版本信息 | ||
prerelease | npm version prerelease | package.json 中的版本号1.0.0变为 1.0.1-0 | 再次使用npm version prerelease prerelease增版本号+1，变成1.0.1-1 | 当执行npm version prerelease时，如果没有预发布号，则增加minor，同时prerelease 设为0； 如果有prerelease,则prerelease 增加1。 所以第一次搞预发布版本，得先有预发布号 |
prepatch | npm version prepatch | package.json 中的版本号1.0.1-1变为 1.0.2-0 | prepatch - 直接升级小号，增加预发布号为0。 | 如果没有prerelease，则自动增加prerelease版本号为0 如npm version prepatch 版本号3.0.0 变为 3.0.1-0 |
preminor | npm version preminor | package.json中的版本号1.0.2-0变为 1.1.0-0 | preminor - 直接升级中号，小号置为0，增加预发布号为0 | 如果没有prerelease，则自动增加prerelease版本号为0 如npm version premajor 版本号1.1.0 变为 2.0.0-0 |
premajor | npm version premajor | package.json 中的版本号1.1.0-0变为 2.0.0-0 | premajor - 直接升级大号，中号、小号置为0，增加预发布号为0。 | 如果没有prerelease，则自动增加prerelease版本号为0 如npm version premajor 版本号2.1.0 变为 3.0.0-0 |
patch | npm version patch | package.json 中的版本号2.0.0-0变为 2.0.0 | 再次执行npm version patch package.json 中的版本号2.0.0变为 2.0.1 | patch： - 如果有prerelease ，则去掉prerelease ，其他保持不变 - 如果没有prerelease ，则升级patch |
minor | npm version minor | package.json 中的版本号3.0.1-0变为 3.1.0 | 再次执行npm version minor package.json 中的版本号3.1.0变为 3.2.0 | minor： - 如果有prerelease ，则去掉prerelease ，其他保持不变 - 如果没有prerelease，直接升级minor， 同时patch设置为0 |
major | npm version major | package.json 中的版本号3.1.0-1变为 4.0.0 | 再次执行npm version minor package.json 中的版本号4.0.0变为 5.0.0 | major - 如果没有prelease，则直接升级major，其他位都置为0； - 如果有预发布号： minor和patch都为0，则将prerelease 去掉，升级major。这里升不升级主版本号？待测试 - 如果有预发布号：且minor和patch有任意一个不是0，则升级一位major，其他位都置为0，并去掉prerelease。 如：5.1.0-0 -->6.0.0 |
升级版本与git仓库
效果如图： 
** 执行版本提升命令前，会检查git仓库树是否全部提交，如果没有将不成功： 
只有清空暂存区后，该系列命令才会生效。 版本提升后，package会自动修改，且自动commit，好神奇！ 然后我就直接push代码就行了。
代码提交干净了，发版时刻终于来啦！????一切顺利～
发布命令
版本修改成功后，执行命令进行发布
npm publish
偶no！果然报错了！说我package.json里的private属性不符合开源协议吧，需要将之删除。 
修改了package.json，还需要提交git仓库，清空暂存树。
发布成功????
image.png
现在再去NPM搜索包名就已经有啦！哈哈哈哈哈哈哈哈！！！
来个全家福????
image.png
来个正脸照????：
image.png
越努力，越幸运；阿门。
