我为什么要做组件库自动打包发布?
我们做一个组件库,一般会在package.json里定义若干个脚本,来实现本地预览、打包。我一般使用pnpm dev运行本地测试环境、pnpm build打包组件库。
自己改完,立马就能生效。想要发布一个版本,手动build一下,加个changelog,再push一下。
业务通常是多变的,需求改动也会经常影响到业务组件库的变化。所以业务组件库做不到公共组件库那种隔一段时间才发布一个版本的要求。只有改完立马就能被各个开发同学使用,才有存活下去与不断改进的机会。
每次发版本都在build、打changelog、push的过程中浪费了心力,隔一段时间再来管理组件库,还要再回忆下发布组件库的流程。
所以,我为什么不封装一个自动打包并发布的脚本呢?
大概流程
流程如下:
- 提交所有代码
- 添加自动打包并发布的命令
"publish-xxx": "pnpm build && sh ./script/publish.sh" - 创建一个脚本
publish.sh: - (1)更新版本号
- (2)增加一个 commit(用来提交打包后的产物、package修改)
- (3)标记版本 tag
- (4)控制台打印成功消息
- (5)自动生成changelog
- (6)发布库到内部npm
介绍 public.sh
均在bash环境下执行。
1.更新版本号
npm version patch # 每次更新一个小版本。
VERSION=$(node -p "require('./package.json').version")
NAME=$(node -p "require('./package.json').name")
这里,我们修改了package.json文件中version,并且保存一下版本号变量VERSION、包名称变量NAME。
直接修改package.json文件中version的命令有这些:
(1)npm version pacth,1.0.1 变为 1.0.2
(2)npm version minor,1.0.1 变为 1.1.0
(3)npm version major,1.0.1 变为 2.0.0
2.增加一个commit
git commit -am "punblish version ${VERSION}"
因为脚本在打包后执行,所以创建一个提交去保存打包后的产物,以及package.json的变更。
3.标记版本tag
TAG_NAME=v${VERSION}
git tag -d ${TAG_NAME} 2>/dev/null
git tag ${TAG_NAME}
这里,我给tag名称改为vxxx的形式。首先删除这个tag,避免打tag时遇到之前存在同名tag直接报错跳出流程。
2>/dev/null是linux中的输出流机制,2代表错误输出流,/dev/null代表空,2>/dev/null指的是不打印错误日志,也不会保存到某个日志。这么做是为了减少控制台打印消息。
4.控制台打印成功消息
printf "\n\nUPDATE SUCCESS!"
printf "\n🔥Tag is ${TAG_NAME}."
printf "\n🔥Version is ${VERSION}.\n\n\n"
5.生成changelog
conventional-changelog -p angular -i CHANGELOG.md -s -r 0
git commit -am "append changelog" # (新增提交,避免重写提交覆盖tag)
第一条命令可以参考 conventional-changelog-cli 这个插件的描述,是添加一个changelog记录到已存在的CHANGELOG.md文件(注意开始不存在文件会报错,需要提前手动建立一个同名文件)。
第二条命令就是提交 CHANGELOG.md 这个文件的改动了。
注意:
changelog自动生成交由社区插件conventional-changelog-cli、cz-conventional-changelog完成(每次执行gz命令替代git commit去提交、使用husky在提交前走git hooks再拦截校验一下输入、这样后续可以使用conventional-changelog命令去自动生成changelog)
6.发布到内部npm
ADDRESS=https://registry.npmjs.org/
npm unpublish ${NAME}@${VERSION} 2>/dev/null --registry=${ADDRESS}
npm publish --registry=${ADDRESS}
这里,我以发布到npm源为例。先删除目标版本,再提交目标版本,避免报错导致中断跳出流程
如何让windows支持运行bash脚本(sh命令、bash命令)?
众所周知,linux、mac自带了bash、sh命令,win10、win11都没有。
这里用一个取巧的办法:
(1)前往git安装文件夹下,复制bin文件夹的路径
(2)将bin文件夹路径放到系统环境变量下面
(3)使用bash、sh命令