在前端自动化这么流行的大环境下，如果我们还手动打包，push到远程，效率会变得十分底下，目前第三方ci服务很多，所以集成ci变得十分的方便，如果没有自己的服务器，可以使用第三方的ci服务器，比如：
- circle-ci
- travis-ci
今天要介绍的就是travis-ci这款自动化部署流程
效果预览图：
什么是CI/CD
ci全名Continuous Integration（持续集成）和Continuous Delivery（持续发布），简单理解ci就是不断的合并代码并且推送代码，cd就是集成后自动发布的这么一套流程
CI/CD能帮助到开发人员什么
这让我想起我第一家实习公司的工作经历，工作模式十分的原始，流程如下：
- 本地开发，开发完后本地打包
- 使用filezila手动传输到远程
- 一直重复。。。
这种原始的模式让人十分的困扰，首先，并没有远程个人分支的概念，每个人都可以覆盖别人的东西，关键是你还不知道谁覆盖的，其次，每次都自己手动打包，手动传，这谁受得了（当然你可以用脚本做这些，但还是不会有你直接把代码push到远程，让别人帮你做来得爽快）
所以，ci/cd其实就是能帮助开发人员专注开发自己的代码，开发完成只需要push一次代码，剩下的工作lint/deploy/notify，远程服务器都会帮你做了。
怎么做
这里使用travis-ci举例，部署一个vue项目，打开页面后选择documention进行文章阅读（最好是读原文）
- 首先会让你授权travis访问github权限
- 打开terminal，
mkdir travis-demo && cd travis-demo通过vue create创建一个叫travis-demo的项目 - 在github仓库创建一个travis-demo的项目
- 在第二步的terminal中,
code .vscode自动打开工程，使用git remote add origin ssh://github.com/user/repo.git把你的项目添加进来（最好能使用ssh协议，ssh协议就不用每次都输入账号密码了，我自己在家用的win10，然后使用ssh配置github的key时，ssh服务无法自动启动，这个坑大家可以谷歌一下，有解决方案，或者github有关于ssh不生效的解决办法） - 在根目录创建.travis.yml
- 在第一步打开的travis官网，在banner位置找到Documention，我们点到Programming Languages，选择node环境，注意有个坑，它会默认跑npm test的script，如果你项目中的script没有这个命令，ci就会失败，这里先贴一下自己完成的配置文件
简单解释下每一行的作用（注意，缩进要缩进好，不然会无效），
- language就是语言类型，我们选的node
- node_js对应的是哪个版本
- cache表示把node_modules缓存起来，这样下次ci的时候不用重新安装依赖
- 下面几个是travis的job-lifecycle,拥有丰富的生命周期。
- install，安装阶段
- script（就是这个东西如果不覆盖默认会跑npm test）
- 最后就是deploy了，deploy的功能就是把你的页面打包部署到github页面，参考travis-deploy,除了github-page，你可以部署在其它它支持的地方，deploy需要在github的settings中生成personal-assess-token
点击进去勾选第一个repo选项，点确定会生成一个key，记住这个key，复制好，然后到
settings中，找到
把环境变量add进去即可。
接下来，你只需要push代码，然后看一下travis-ci跑的流程，最后在github找到settings，往下拉找到
点一下就可以访问了。可能会白屏，打开控制台，发现资源404了，因为访问的路径不是根目录，所以需要在vue项目，新建vue.config.js,然后添加
module.exports = {
publicPath: process.env.NODE_ENV === 'production' ? '/travis-demo' : '/'
};
这个表示资源访问路径，加上项目名称，最后再push一次，等待ci完成
完成了～
