1

背景

前端的开源项目发布的步骤:

  1. 将代码提交到GitHub
  2. 运行单元测试;
  3. 发布到npm上;

以上步骤每次发布都要做一边,不仅繁杂,而且人工完成容易出错,因此通过自动化来完成这些工作变得很有必要。
阅读本文需要你对使用jenkins + docker来实现自动化部署有一定实践经验。

实现流程

  1. 将代码通过git提交至GitHub;
  2. GitHubwebhook触发jenkinspipeline任务;
  3. pipeline任务执行测试命令;
  4. 测试通过后,对比npm线上的包和当前package.json中的版本号;
  5. 版本号不同的情况下构建代码,登录npm,将包发布到npm

实现原理

本文不打算从零开始讲述每个实现的步骤和细节,只讲实现流程中一些比较有价值的方法和原理。

代码提交到GitHub触发jenkinspipeline任务

  1. 安装一个jenkins插件:multibranch-scan-webhook-trigger
  2. 打开pipeline任务的配置,找到扫描 仓库 触发器,勾选Scan by webhook,并且在Trigger token中填入一个随机的字符串。image
  3. 打开GitHub代码仓库 -> 点击Settings -> 点击Webhooks-> 点击Add webhook -> 在Payload URL中填入:JENKINS_URL/multibranch-webhook-trigger/invoke?token=Trigger token,其中JENKINS_URL是你的jenkins服务地址,Trigger token则对应步骤2填入的随机字符串。image

完成以上配置,下次你提交代码就会自动触发对应的pipeline任务。

如何通过shell脚本登录npm

发布npm包只需要执行:

npm publish --access public

但是前提是要先登录你的npm账户,通常情况下可以通过执行npm login,然后输入用户名密码邮箱即可登录,但是在jenkins中没法实现这种交互式输入的。解决办法是安装npm-cli-login,这样就可以通过以下脚本直接登录:

NPM_USER=testUser NPM_PASS=testPass NPM_EMAIL=test@example.com npm-cli-login

如何对比线上npm包的最新版本号和当前代码中的版本号

某些情况下你只是想提交内容到GitHub上,并不想发布新的包到npm上。所以不能每次一提交代码就发布npm包的,需要先判断当前版本号是否和线上的一致,如果一致则不发布包,反之则发布。
1.获取线上npm包的版本号,可以通过以下脚本获取

npm view <package name> version

2.获取当前项目代码的版本号

node -p "require('./package.json').version"

3.对比两个版本号

versionOnline=$(npm view <package name> version)
versionLocal=`node -p "require('./package.json').version"`
if [ "$versionOnline" != "$versionLocal" ]; then
// 发布
fi

完整的脚本

versionOnline=$(npm view <package name> version)
versionLocal=`node -p "require('./package.json').version"`
if [ "$versionOnline" != "$versionLocal" ]; then
npm install -g npm-cli-login --registry=https://registry.npm.taobao.org
NPM_USER=${NPM_USER} NPM_PASS=${NPM_PASS} NPM_EMAIL=${NPM_EMAIL} npm-cli-login
npm publish --access public
fi

其它

一些相对大型的开源库还需要部署文档等操作,也可以用jenkins来完成,这样整个发布流程需要手动完成的就只剩下提交代码了。


hhm1999
12 声望0 粉丝