1. 在Vue项目根目录创建.travis.yml文件, 内容可参考Travis官方文档 ```yaml dist: bionic # 系统 language: node_js # 语言环境 node_js:
    • 12.16.2 # node版本 cache: npm # 缓存modules install:
    • npm install script: npm run build branch: only:
      • master # 只监听主分支上的提交 git: quite: true depth: 1 notifications: email:
      • qqqqq@qq.com # 邮件通知 on_success: never # default: change on_failure: always # default: always

部署到gitpage, 默认推送到gh-pages分支

deploy: provider: pages #git page skip_cleanup: true github_token: $DEPLOY # GITHUB TOKEN keep_history: true on: branch: master local_dir: ./dist/ # 推送内容,不写时默认推送整个项目到gh-pages分支

  1. -
  2. [travis支持的系统](https://docs.travis-ci.com/user/reference/overview/):
  3. - Ubuntu Linux(bionic | xenial | trusty | precise)
  4. - Windows(windows)
  5. - MacOS(osx)
  6. ```yaml
  7. dist: windows # 使用windows系统构建
  • travis支持的语言环境有(可以在文档 > Programming Languages 下查看具体支持的语言): Android, C, GO, JAVA, JS(NODEJS) ···
    可以使用language字段指定语言环境:
    1. language: node_js # 指定语言环境为node
    2. node_js:
    3. - 12.16.2 # 指定node的具体版本
  • travis中job的生命周期, install和script也属于生命周期的一部分,可以使用该字段选择在其生命周期内执行相应操作
    1. before_install: command #安装阶段之前
    2. install: command # 安装所需的任何依赖项
    3. before_script: command # 在脚本阶段之前
    4. script: command #运行生成脚本
    5. before_cache: command # 缓存之前,可用于清理缓存
    6. after_success: command # 当生成成功时
    7. after_failure: command # 当生成失败
    8. before_deploy: command # 部署之前
    9. deploy: command # 部署
    10. after_deploy: command # 部署之后
    11. after_script: command # 在脚本阶段之后。
  1. 进入Travis官网, 使用github账号授权登录, 然后添加需要集成的仓库
    使用travis自动化部署Vue项目到GitPage - 图1

  2. 进入github setting>Developer setting > Personal access tokens,选择权限,点击生成token
    使用travis自动化部署Vue项目到GitPage - 图2

  3. 复制github token,进入第2步页面,点击仓库后面的settings,添加环境变量,
    使用travis自动化部署Vue项目到GitPage - 图3

  4. 然后在主分支提交代码时就可以自动部署
    使用travis自动化部署Vue项目到GitPage - 图4

  5. 将travis中仓库的构建状态同步到github
    使用travis自动化部署Vue项目到GitPage - 图5
    点击上图中的红色框中的build状态图标
    使用travis自动化部署Vue项目到GitPage - 图6
    然后选择状态需要同步到的分支和砖头盖显示的格式,完成后将RESULT中的内容拷贝到仓库中相应分支的的README.md中
    使用travis自动化部署Vue项目到GitPage - 图7