共计 3579 个字符，预计需要花费 9 分钟才能阅读完成。
前言
本文次要讲如何用 Travis 来实现自动化部署，并参照 Github 实在我的项目开发简略场景来介绍。
CI/CD
在说 Travis 之前，先理解一下 CI/CD 的概念。
CI
CI（Continuous integration）—— 继续集成。继续集成是指频繁地（一天屡次）将代码集成到骨干，重视将各个开发者的工作汇合到一个代码仓库中，在源代码变更后会自动检测、拉取、构建和进行单元测试，其目标在于让产品疾速迭代，同时保障高质量。
比方日常工作中，向 development 分支提交一个 PR，配置好 Travis 就会进行自动测试等等工作，通过并被 review 后能力容许合并到开发分支。一旦自动测试脚本有谬误，则不容许合并。
CD
CD 可对应多个英文名称，一个是 继续交付（Continuous delivery），一个是 继续部署（Continuous deployment）。
继续交付 指频繁地将软件的新版本交付给品质团队或者用户，以供评审。如果评审通过，代码就进入生产阶段。
指标是领有一个可随时部署到生产环境的代码库。益处在于，每次代码的小幅变更，就能看到运行后果，从而一直累积小的变更，而不是在开发周期完结时，一下子合并一大块代码。
继续部署 指继续交付的下一步，指的是代码通过评审当前，主动部署到生产环境。指标是代码在任何时刻都是可部署的，能够进入生产阶段。
继续交付并不是指软件每一个改变都要尽快部署到产品环境中，它指的是任何的代码批改都能够在任何时候施行部署。
继续交付示意的是一种能力，而继续部署示意的则一种形式。继续部署是继续交付的最高阶段
Travis 是什么
Travis CI 提供的是继续集成服务，它能够绑定 Github 下面的我的项目，只有有新的代码，就会主动抓取。而后，提供一个运行环境，执行测试，实现构建，还能部署到服务器。当然这只是其中一种 CI 工具，另外还有 Jenkins 等。
本文仅仅做的抛砖引玉，让你对这些概念和 Travis 有初步理解和应用，不再生疏，残余的就靠你本人去学习了。兴许你感觉这是公司企业级我的项目才配上的货色，但其实 Travis 是收费的，集体开发者也能够进行应用，而且是挺好用。
注册 Travis
进入 https://travis-ci.com，
比方我抉择 Github 形式登录
登录之后 Github 的 repo 受权给 travis，我间接选 All，开启对我的项目的监控
选完之后回到主页就能看到你的仓库页面了，能够看到有一个我的项目我是配置了 travis 的，所以显示绿色状态。
这我的项目是最近在本人动手做的 React 组件库我的项目 monki-ui，尽量参照企业级规范搭建的，技术栈是React + TypeScript + Dumi + Jest，感觉不错可供借鉴学习的话能够 ✨ star 一下哦 …
获取 Github Access Token
接着进入 Github -> Developer settings -> Personal access tokens -> Generate new token
勾选 repo 下的所有项，以及 user 下的 user:email 后，会生成一个 token，而后记得复制保留好，因为生成后当前就不会再显示了，如果遗记那必须从新生成 token 才能够
配置 Travis
我本人用 create-react-app 初始化了一个 Github 我的项目 travis-demo，删除文件到最简略的我的项目构造。
而后模仿一下日常开发场景，让大家领会工作中的利用，我先是从 master 分支 checkout 出 development 分支，并把 development 分支设置为 default 分支，这个就当做咱们开发中的 dev 分支，日常 PR 都会合并到该分支上。
而后从 development 分支 checkout 出一条分支docs/update-readme，接着批改 readme 的内容，git add 和 git commit 后就待 push 了。
咱们下面生成的 token 曾经说了要先保留好的，接着去 travis-ci 官网，找到方才创立的我的项目Jacky-Summer/travis-demo，点进去抉择Settings
- 设置全局变量(Environment Variables)
NAME个别标准是大写和下划线来命名，这里我取为 GITHUB_TOKEN，VALUE 为咱们保留的 token，而后抉择 Add 增加
我的项目新建配置文件
在我的项目根目录配置 .travis.yml 配置文件（以后在docs/udpate-readne）
language: node_js # 设置语言
node_js:
- 12 # 指定 node.js 版本
cache: yarn # 开启缓存
install:
- yarn
script:
- yarn build接着就 push 到近程分支，此时关上 github 我的项目仓库，点击Create pull request，
就会看到此时 Travis 正在运行了，它在干什么事，能够点进 Details 去看看，它就是从头来一遍咱们我的项目，git clone开始，而后yarn install，yarn build，整个过程没有谬误，那就通过了，通过之后看到此时 PR 这样显示的：
通过阐明咱们能够 Merge 了，这里我抉择 Squash and merge 合并，合并后会再次跑一次 Travis（但日常开发我司是要先有其余共事 review 通过能力 merge 的）。此时咱们的 PR 就合并到 development 分支上了，你的邮箱整个过程中也会有邮件告诉你。
但其实你会发现你不必等它 Travis 运行实现，咱们就能够点 Merge 按钮，按情理它应该临时禁用才对，等到 Travis 通过才容许按。这个在Github 该我的项目目录 -> Settings -> Branches -> Add rules，这里只是简略举个例子如下：
仅仅这样可能并感触不到什么作用，当初咱们切换回 development 分支，git pull最新代码，再 checkout 一条新分支test/test-case-example，增加个测试文件src/index.test.js
如果不晓得什么是单元测试的能够看我这篇文章：一文带你理解 Jest 单元测试
describe('单元测试', () => {it('测试用例', () => {
const foo = true
expect(foo).toBeTruthy() // 冀望 foo 变量的值为 true})
})当然这是个白痴没有意义的测试，运行yarn test，测试用例通过，如果咱们批改代码
describe('单元测试', () => {it('测试用例', () => {
const foo = true
expect(foo).toBeFalsy() // 测试不会通过})
})此时 yarn test 不会通过，这就对应咱们日常批改代码后，假如你没有从新运行测试（但测试用例理论是运行谬误的），你却 push 下来了，又合并了就麻烦了，因为测试不过阐明你代码可能存在问题。
接着须要 Travis 帮忙了，批改 .travis.yml 文件
language: node_js
node_js:
- 12
cache: yarn
install:
- yarn
script:
- yarn test # 运行测试
- yarn build- 接着同上步骤，开个 PR，此时显示如下，此时就看到 Travis 显示
Required，但因为我是我的项目惟一拥有者兼管理员，所以仍然能够间接 merge，但如果其他人 PR 上来，则是不行的要等 Travis 通过才容许按 merge 按钮
等一会你会发现它挂了，这里就显示 × 号了，此时失败不能合并（非管理员）。
咱们去 Details 外面看看哪里出错了，看到是测试用例出错导致 Travis 无奈通过：
- 于是此时咱们应该是去批改代码，再提交，这就是 Travis 的其中一个常见的作用了。
- 其后它还有很多其它能够玩的，比方自动化部署到 Github page 页面，在我当初的 React 开源组件库 monki-ui – travis 配置 作为例子
deploy:
provider: pages # 指定部署到 Github Pages，即 gh-pages 分支
github_token: $GITHUB_TOKEN # 名字对应咱们上方的 token
skip_cleanup: true # 指定保留构建后的文件
keep-history: true # 指定每次部署会新增一个提交记录再推送，而不是应用 git push --force
local_dir: docs-dist # 指定构建后要部署的目录
on:
branch: master # 指定 master 分支有提交行为时，将触发构建后部署- 本文介绍到这里就完结了，Travis 还有很多其余有用的配置，就须要日常开发本人去理解了。
- 本文案例代码地址 travis-demo
参考文章： - 继续集成服务 Travis CI 教程
- ps：集体技术博文 Github 仓库，感觉不错的话欢送 star，给我一点激励持续写作吧~
