Автоматический деплой GitHub Pages через Travis CI

Задача: есть репозиторий организации на гитхабе (inside-demo/webpack-global-vendor-demo).
Надо после изменения ветки master собирать демо на GitHub Pages (inside-demo.github.io/webpack-global-vendor-demo).

Этапы деплоя:

  1. Установить зависимости: npm install
  2. Собрать проект: npm run build
  3. Добавить директорию build
  4. Закоммитить в ветку gh-pages

Создаем GitHub-токен для деплоя из Travis CI

источник

Переходим на https://github.com/settings/tokens
Жмем "Generate new token"
Называем токен inside-demo/webpack-global-vendor-demo
Отмечаем только "public_repo"
Копируем токен

Подключаем Travis CI

Переходим на страницу https://travis-ci.org/profile/inside-demo
Жмем "Sync account"
Когда синхронизация закончится, появится наш репозиторий
Переходим в https://travis-ci.org/inside-demo/webpack-global-vendor-demo
Включаем проект "Activate repository"
Перезагружаем страницу

Добавляем GitHub-токен в травис

источник

Жмем "More options" → "Settings"
Создаем в "Environment Variables"

  • Name: GITHUB_TOKEN
  • Value: Вставляем сгенерированный GitHub-токен

Жмем "Add"

Добавляем настройки деплоя в .travis.yml

источник

Создаем в проекте файл .travis.yml
Добавляем секцию deploy
Добавляем запуск сборки перед деплоем в секцию before_deploy
Так как билд добавлен в .gitignore, необходимо переписать файл .gitignore

language: node_js
node_js: node

before_deploy:
  - npm run build
  - echo -e "node_modules\npackage-lock.json" > .gitignore

deploy:
  provider: pages
  skip-cleanup: true
  github-token: $GITHUB_TOKEN
  keep-history: true
  on:
    branch: master

Если в проекте есть тесты, которые запускаются на разных версиях NodeJS, то надо обновить правило on в секции deploy, чтобы сборка собиралась один раз

language: node_js
node_js:
  - 10
  - 8

before_deploy:
  - npm run build
  - echo -e "node_modules\npackage-lock.json" > .gitignore

deploy:
  provider: pages
  skip-cleanup: true
  github-token: $GITHUB_TOKEN
  keep-history: true
  on:
    branch: master
    node: 10

Материалы

Примеры

Source code
DeployGitHub PagesTravis CI