什么是Github Actions 详细请查看官方文档 ,或者可以查看阮一峰写的这篇博客
简单来说就是一个自动化构建工具,可以在git仓库接收事件之后触发对应的action,例如发布,构建等等
使用Github Actions构建自动构建Electron 在Github的虚拟机中装好node依赖,然后执行项目中的打包指令,收集构建完成的产物,然后发布到release,等待正式的发布。
撰写构建指令 以我的为知笔记客户端 为例,
由于我使用了Quasar UI框架,所以我就直接使用它提供的CLI来构建项目
1 2 3 4 5 6 7 8 "scripts": { "lint": "eslint --ext .js,.vue ./", "dev": "quasar dev -m electron -t mat", "build-develop": "quasar build -m electron -d", "build-publish": "quasar build -m electron -P", "build-all": "quasar build -m electron -T all -P", "build": "quasar build -m electron" },
在不同的系统使用build-publish
就可以构建对应系统的客户端。
然后我们还需要找到构建产物的生成地址,一般都是在dist文件夹或者build文件夹之类的,可以在本地找到对应的文件夹然后再写到CI脚本中,例如我在本地的路径就是:dist/electron/Neeto-Vue-darwin-x64/*
这个文件夹下都是生成的产物。
撰写CI脚本
打开github仓库,点击tab中的actions标签,进入actions的编辑页面,如果你没有创建过Github Actions,那么它就会提供一些模板,这里我选择自己创建脚本。
可以在github直接编辑CI脚本。
参考阮一峰的文章可以知道每个字段的含义。
1 workflow > job > step > bash, use other action etc..
是一个层级嵌套的关系,从每一步的脚本再到一个job再到整个文件的workflow,jobs是可以并行运行的,但每个jobs并不共享环境,所以我们需要解决一个问题,我们的构建产物需要上传到一个公共的区域,这样才能在release步骤中一起发布到仓库的release中。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 build-windows: runs-on: windows-latest if: contains(github.ref, 'refs/tags/v' ) steps: - name: Check out branch uses: actions/checkout@master - name: Install Node.js, NPM uses: actions/setup-node@v1 with: node-version: 14 - name: Build run: | npm install npm run build-publish - name: Compress Bundle run: | npm install -g bestzip bestzip Neeto-Vue-win32-x64.zip dist/electron/Neeto-Vue-win32-x64/* - name: Upload Win Package uses: actions/upload-artifact@v1 with: name: Windows_Dist path: Neeto-Vue-win32-x64.zip
以构建windows系统的包为例。从上到下依次为:
该jobs需要运行在最新的Windows上
只有在推送tag时才会触发对应的脚本构建,节约时间
然后指明各个脚本的步骤
第一步先检出master分支,因为只有master分支更新时我们才需要构建新的版本
指明我们需要nodejs 14版本
然后执行构建脚本
安装nodejs环境
由于quasar构建出来的包是一个文件夹,直接上传会在发布的时候出错,因此我们需要将其压缩成一个文件
然后我们使用github官方的actions将上面构建好的包上传到artifact,以供后期发布使用
指定发布的位置和名字
再来看release的部分
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 release: needs: [build-windows, build-linux, build-mac] runs-on: ubuntu-latest if: contains(github.ref, 'refs/tags/v' ) steps: - uses: actions/checkout@v1 - name: Download pre-built packages for Linux uses: actions/download-artifact@v1 with: name: Linux_Dist path: artifacts - name: Download pre-built packages for Windows uses: actions/download-artifact@v1 with: name: Windows_Dist path: artifacts - name: Download pre-built packages for MacOS uses: actions/download-artifact@v1 with: name: MacOS_Dist path: artifacts - name: Create Release id: create_release uses: ncipollo/release-action@v1 with: name: Neeto-Vue token: ${{ secrets.GITHUB_TOKEN }} artifacts: "artifacts/*" draft: true prerelease: true
这一步需要三个系统的包都构建成功才能执行,同时也只有在发布新的tag的时候才会运行,节约不必要的损耗。
签出分支
下载前面上传到artifact的包
然后使用ncipollo
的发布脚本来发布我们的构建产物
至此就完成了整个构建流程