前言
总有前辈们辛苦的去探索新轮子,造福我们这些晚辈哈!
最近研究了一个自动化部署的东西,大大造福开发的工程师们,再也不用一直重复的去做繁琐的部署工作了,一步到位,后面就可以好好开发了,把时间放在该花的地方。
软件开发的持续方法基于自动执行脚本,以最大程度地减少在开发应用程序时引入错误的机会。从开发新代码到部署新代码,他们几乎不需要人工干预,甚至根本不需要干预。
一、GitLab CI/CD 是什么?
GitLab CI/CD 是一个内置在 GitLab 中的工具,用于通过持续方法进行软件开发:
GitLab CI/CD 由一个名为 .gitlab-ci.yml 的文件进行配置,改文件位于仓库的根目录下。文件中指定的脚本由 GitLab Runner 执行。
基本 CI/CD 工作流程
一旦你将提交推送到远程仓库的分支上,那么你为该项目设置的 CI/CD 管道将会被触发。GitLab CI/CD 通过这样做:
- 运行自动化脚本(串行或并行) 代码Review并获得批准
- 构建并测试你的应用
- 就像在你本机中看到的那样,使用 Review Apps 预览每个合并请求的更改
- 代码 Review 并获得批准
- 合并 feature 分支到默认分支,同时自动将此次更改部署到生产环境
- 如果出现问题,可以轻松回滚
二、如何配置
1.配置gitlab runner
gitlab后台找到这个,进行配置,这里有更加详细的教程:进入
2.配置.gitlab-ci.yml
简单的示例:
#流水线的stages的顺序可以自己定义
#相同阶段的任务将会并发的执行,上一个阶段的任务完整的结束之后,下一个阶段的任务才会开始执行
stages:
- check_code
- build
- deploy
job1:
stage: check_code
script:
- echo 'stage1 job ,读取变量为:' $param1
job2:
stage: build
script:
- echo 'stage2 job ,读取变量为:' $param2
job3:
stage: deploy
script:
- echo 'stage3 job ,读取变量为:' $param3
对于Vue的项目你可以这样写
image: aa-us3
variables:
GIT_DEPTH: 10
stages:
- install
- build
- deploy
cache:
key: ${CI_BUILD_REF_NAME}
paths:
- node_modules/
build_release:
stage: build
script:
- sed -i 's/{{account_url}}/\/\/api.cn\//g' .env #接口地址
- sed -i 's/{{env}}/studio/g' .env #环境变量
- npm install --registry=https://registry.npmmirror.com
- npm run build
- cd ./anchor_unity_webrtc/
- ls -l | grep "^d" | awk '{print $9}' | awk '{print "cp -r ./" $0 " us3://xx-editor/"}' | xargs -L 1 us3cli
- ls -l | grep "^-" | awk '{print $9}' | awk '{print "cp ./" $0 " us3://xx-editor/"}' | xargs -L 1 us3cli
- ucdn_refresh -type=dir -list=http://xx-editor.cn/
tags:
- nodojs_deploy
only:
- /^tag_release.*$/
build_master:
stage: build
script:
- sed -i 's/{{account_url}}/\/\/192.168.11.209:4006\//g' .env
- sed -i 's/{{env}}/webapp/g' .env
- rm ./public/robots.txt
- npm install --registry=https://registry.npmmirror.com --force
- npm run build
- rsync -az --delete --password-file=<(echo "123456") ./xx/ rsync@192.168.11.243::dev_xx_editor/
tags:
- nodojs_deploy
only:
- /^master.*$/
然后在项目的根目录下写上配置文件:
内容如下:
VUE_APP_ENV='{{env}}'
VUE_APP_ACCOUNT_URL='{{account_url}}'
这样子就配置好了一个简单的基于Vue的自动化部署了,有没有收到启发了,其实还可以增加多个打包模式,增加多个打包环境的任务,达到应付多种场景的需求
总结
对于前端的同学来说,去探索实现这个还是有点难度的,一般情况下也没太大需要。不过如果你项目达到一定程度,当你无法分身的时候,就试试这个轮子吧!好用到你想不到,以后不用让他人催着你部署了,全自动,就是这么简单。