travis(1)npm通用travis配置

• 2019 年 10 月 4 日
• 筆記

文章目錄

• travis(1)npm通用travis配置
  • 簡介
  • node.js與TravisCI集成
    • 1. 登陸github 以及 一個項目
    • 2. 通過github登陸travisCI官網
    • 3. 配置travisCI
    • 4. 配置github page
    • 5. push 並 自動構建
  • 參考文章
  • 我的主頁

travis(1)npm通用travis配置

簡介

Travis CI是在軟體開發領域中的一個在線的，分散式的[1]持續集成服務，用來構建及測試在GitHub[2]託管的程式碼。這個軟體的程式碼同時也是開源的，可以在GitHub上下載到[3]，儘管開發者當前並不推薦在閉源項目中單獨使用它。[4]

它提供了多種程式語言的支援，包括Ruby、JavaScript、Java、Scala、PHP、Haskell和Erlang在內的多種語言[5]。許多知名的開源項目使用它來在每次提交的時候進行構建測試，比如Ruby on Rails，Ruby和Node.js[5][6]。

——wiki

node.js與TravisCI集成

1. 登陸github 以及 一個項目

要使用travisCI工具，首先必須要有一個github的帳號，自己去註冊！如果不知道git怎麼使用，百度搜索廖雪峰git教程

其次，註冊完成後，在你自己的帳號下創建一個項目倉庫，並把你的vue項目程式碼提交到上面。

2. 通過github登陸travisCI官網

進入travisCI官網 ，使用github登錄。

同步你的倉庫。

選擇其中一個倉庫，進行設置。

這裡需要設置一些變數，以便第3步的配置。類似下面介面，如果後面travis介面更新了，自己找方法設置，這裡貼圖。

GH_REF：倉庫地址  GH_TOKEN：github生成的令牌,具體百度'生成github 令牌'  P_BRANCH：推送的部署了pages的分支名稱  U_EMAIL：git.email郵箱  U_NAME：git.username名稱

3. 配置travisCI

這裡貼出npm的通用配置，因為裡面的配置，emm…新手可能看不懂，沒關係，現在去了解一波，然後回來設置，天資聰慧的你可能光是看英文就懂了呢。這裡給出阮一峰的教程

language: node_js  # nodejs版本  node_js:      - '6'    # Travis-CI Caching  cache:    directories:      - node_modules      # S: Build Lifecycle  install:    - npm install    before_script:    # 無其他依賴項所以執行npm run build 構建就行了  script:    - npm run build    after_script:    - cd ./dist    - git init    - git config user.name "${U_NAME}"    - git config user.email "${U_EMAIL}"    - git add .    - git commit -m "Update tools"    - git push --force --quiet "https://${GH_TOKEN}@${GH_REF}" master:${P_BRANCH}  # E: Build LifeCycle    branches:    only:      - develop  env:   global:     # 我將其添加到了travis-ci的環境變數中

4. 配置github page

emm…這個是要去github的倉庫上面的settings裡面配置一下，選擇一個分支作為源就ok了。弄這個的原理就是我們的travis的腳本裡面，npm run build 後的 dist的頁面會拷到這個分支裡面。然後就可以展示了。具體可以參考

注意： 圖片和樣式的路徑問題，自己手動配置一下。

5. push 並 自動構建

現在只要對本地的develop分支提交程式碼，travis就會對我們的程式碼進行 npm run　build 編譯。並且將dist 的內容push --force 到githu pages 的分支，現在就可以通過github的站點域名訪問我們的項目了。