1.介绍
CI/CD
CI,Continuous Integration,为持续集成。即在代码构建过程中持续地进行代码的集成、构建、以及自动化测试等;有了 CI 工具,我们可以在代码提交的过程中通过单元测试等尽早地发现引入的错误;
CD,Continuous Deployment,为持续交付。在代码构建完毕后,可以方便地将新版本部署上线,这样有利于快速迭代并交付产品。
阮一峰教程:www.ruanyifeng.com/blog/2017/1…
Travis CI
用好这个工具不仅可以提高效率,还能使开发流程更可靠和专业化,从而提高软件的价值。而且,它对于开源项目是免费的,不花一分钱,就能帮你做掉很多事情。
Travis CI 提供的是持续集成服务(Continuous Integration,简称 CI)。它绑定 Github 上面的项目,只要有新的代码,就会自动抓取。然后,提供一个运行环境,执行测试,完成构建,还能部署到服务器。
持续集成指的是只要代码有变更,就自动运行构建和测试,反馈运行结果。确保符合预期以后,再将新代码"集成"到主干。
持续集成的好处在于,每次代码的小幅变更,就能看到运行结果,从而不断累积小的变更,而不是在开发周期结束时,一下子合并一大块代码。
2.创建账号
使用Github账号授权登录
然后授权他仓库查看权限
可以看到仓库列表,但是我们目前仓库上门还没有写构建代码的文件,所以他不能够进行自动构建和集成部署
3.创建配置文件
Travis 要求项目的根目录下面,必须有一个
.travis.yml
文件。这是配置文件,指定了 Travis 的行为。该文件必须保存在 Github 仓库里面,一旦代码仓库有新的 Commit,Travis 就会去找这个文件,执行里面的命令。这个文件采用 YAML 格式。下面是一个最简单的 Python 项目的
.travis.yml
文件。
language: python
script: true
上面代码中,设置了两个字段。
language
字段指定了默认运行环境,这里设定使用 Python 环境。script
字段指定要运行的脚本,script: true
表示不执行任何脚本,状态直接设为成功。Travis 默认提供的运行环境,请参考官方文档 。目前一共支持31种语言,以后还会不断增加。
我们用vite创建vue项目的持续集成服务配置文件
language: node_js
node_js:
- lts/*
install:
- npm ci
script:
- npm run build
deploy:
provider: pages
skip_cleanup: true
local_dir: dist
# 在 GitHub 上生成的 token,允许 Travis 推送代码到你的仓库。
# 在仓库的 Travis 设置页面,设为安全的环境变量
github_token: $GITHUB_TOKEN
keep_history: true
on:
branch: master
4.运行流程
Travis 的运行流程很简单,任何项目都会经过两个阶段。
- install 阶段:安装依赖
- script 阶段:运行脚本
install
字段用来指定安装脚本。
install: ./install-dependencies.sh
如果有多个脚本,可以写成下面的形式。
install:
- command1
- command2
上面代码中,如果command1
失败了,整个构建就会停下来,不再往下进行。
如果不需要安装,即跳过安装阶段,就直接设为true
。
install: true
script
字段用来指定构建或测试脚本。
script: bundle exec thor build
如果有多个脚本,可以写成下面的形式。
script:
- command1
- command2
注意,script
与install
不一样,如果command1
失败,command2
会继续执行。但是,整个构建阶段的状态是失败。
如果command2
只有在command1
成功后才能执行,就要写成下面这样。
script: command1 && command2
实例:Node 项目
Node 项目的环境需要写成下面这样。
language: node_js
node_js:
- "8"
上面代码中,node_js
字段用来指定 Node 版本。
Node 项目的install
和script
阶段都有默认脚本,可以省略。
install
默认值:npm installscript
默认值:npm test
script
阶段结束以后,还可以设置通知步骤(notification)和部署步骤(deployment),它们不是必须的。
部署的脚本可以在script
阶段执行,也可以使用 Travis 为几十种常见服务提供的快捷部署功能。比如,要部署到 Github Pages,可以写成下面这样。
deploy:
provider: pages
skip_cleanup: true
github_token: $GITHUB_TOKEN # Set in travis-ci.org dashboard
on:
branch: master
其他部署方式,请看官方文档。
最后,Travis 每次运行,可能会返回四种状态。
- passed:运行成功,所有步骤的退出码都是
0
- canceled:用户取消执行
- errored:
before_install
、install
、before_script
有非零退出码,运行会立即停止- failed :
script
有非零状态码 ,会继续运行
5.测试
触发构建
我们push代码即可,会自动触发构建,然后根据main分支内的文件进行构建
要先去github设置里面申请一个令牌,这样就可以让构建的东西部署到相应仓库上,或者操作仓库对应的分支(令牌可以设置到期时长或者永久)
设置构建项目
注入这个私有的全局属性(令牌),这样相对安全一些,可以采用加密方式,官网文档有介绍
6.优化升级
language: node_js
node_js:
- lts/*
# 缓存,可以节省集成的时间,这里我用了yarn,如果不用可以删除
cache:
apt: true
yarn: true
directories:
- node_modules
install:
- npm ci
script:
- npm run build
deploy:
provider: pages
skip_cleanup: true
local_dir: dist
# 在 GitHub 上生成的 token,允许 Travis 推送代码到你的仓库。
# 在仓库的 Travis 设置页面,设为安全的环境变量
github_token: $GITHUB_TOKEN
keep_history: true
on:
branch: main
以后只需添加这个配置,以后push代码,会自动部署构建,以及发布到新的分支
然后设置github-Page,选择新的发布分支
打开部署的githubPagehttps://gip886.github.io/gipmusic/
那个vue
项目已经成功部署在githubPage上,被静态托管了
提示:vue的打包路径,想要部署网上,需要增加文件配置
module.exports = {
publicPath:'./'
}