前端工程化——travis-ci

       針對前端項目的eslint、test、codecc、coverage、build、自動部署等一系列的操做，所有git push操做時一鍵搞定，想一想都是美滋滋吧。

       下面就是介紹github倉庫+travis-ci完成整個操做。

1. 提供在github提供git倉庫
2. github登陸 travis-ci的官網：https://travis-ci.org/，關聯git項目

3. 設置環境變量

    

4. 倉庫根目錄新建.travis.yml文件，內容以下：

language: node_js
node_js:
    - '12'
branches:
  only:
    - master --僅master分支push後纔會構建
install:
    - npm install
script:
    - npm run build
after_script:
  - ls -a
  - rm -rf .git --若是推送整個目錄則須要刪除.git文件，若是隻推送構建後的文件目錄dist則cd ./dist就行，不須要刪除.git文件，不然最後一句git push會推送不上
  - ls -a
  - git init
  - git config user.name "${GH_USER}"
  - git config user.email "${GH_EMAIL}"
  - git add .
  - git commit -m "commit 111"
  - git status
  - git push --force --quiet "https://${GH_TOKEN}@${GH_REF}" master:dev

 

 五、最終構建結果就推送到了當前git倉庫的dev分支。

構建階段：

before_install：install 階段以前執行
before_script：script 階段以前執行
after_failure：script 階段失敗時執行
after_success：script 階段成功時執行
before_deploy：deploy 步驟以前執行
after_deploy：deploy 步驟以後執行
after_script：script 階段以後執行

 

擴展：

文檔僅僅展現了build後，將構建產物推送到dev分支的例子，若是須要增長test、lint等操做，

直接在npm run build以前增長npm run test;npm run lint;腳本