skip to content
Jr. StrangeDev
Table of Contents

pipeline 是 bitbucket 內建的一套 CI 工具，之所以不用 travis CI，是因為 github 跟 travis CI 在 private repo 都要花錢，所以才用 bitbucket 來做。但是要注意 bitbucket 的 free plan 一個月只有 50 分鐘

pipeline 會依照 bitbucket-pipelines.yml 這個檔案來依序執行你在 build 時的動作，以及 build 完成之後，要做什麼事

bitbucket-pipelines.yml
image: node:6.9.4
pipelines:
  default:
    - step:
        caches:
          - node
        script: # Modify the commands below to build your repository.
          # set locale
          - apt-get clean && apt-get update && apt-get install -y locales
          - echo "en_US.UTF-8 UTF-8" > /etc/locale.gen
          - locale-gen
          - export LC_ALL=en_US.UTF-8 && export LANG=en_US.UTF-8 && export LANGUAGE=en_US.UTF-8


          # install global npm
          - npm install hexo-cli -g
          - npm install grunt-cli -g
          - npm install bower -g


          # build theme
          - cd ./themes/tranquilpeak
          - npm install
          - bower install --allow-root
          - npm run prod


          # back to project root folder
          - cd ../../
          - npm install
          - npm test
          - hexo generate


          # generste search index
          - hexo algolia


          # now, install firebase sdk and deploy our static files
          - npm install -g firebase-tools
          - firebase deploy --only hosting --token $FIREBASE_CI_TOKEN --project $FIREBASE_PROJECT

其中幾個部分需要注意：

  1. node image 的 locale
  2. tranquilpeak 需要 build
  3. firebase deploy 的 token
  4. pipeline 的 Environment variables

node 的 docker image

node image 的 locale 預設並不是 en_US.UTF8，所以要先在 image 裡面安裝 locales，並使用環境變數將當下的 locales 更換為 en_US.UTF8。之所以會需要做這件事，是因為我們使用 hexo generate 的時候，如果是使用中文標題，hexo 會依照中文標題的名稱建立一個資料夾，如果你完全不會使用中文標題的話，就可以不用 $ apt-get install locales。如果會的話，就要安裝，以避免掉 ascii' codec can't decode 這種問題。

tranquilpeak 需要 build

因為我使用的是 tranquilpeak 這個 theme，在 commit 上 bitbucket 之後 ，會 ignore build 的資料，所以在 pipeline 上需要再重新 build 一次

firebase deploy 的 token

要取得 deploy 的 token，必須要在自己的 local 端先產生，也就是在自己的 local 端要先安裝 firebase 的環境

Terminal window
$ npm install -g firebase-tools

然後再使用

Terminal window
$ firebase login:ci

這時候會跳出瀏覽器的頁面，然後要你授權給 firebase 的 cli，按下確認後，你就會得到一組 token 了，之後，在 hexo 的根目錄底下加入 firebase.json

firebase.json
{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

因為 hexo generate 後的資料就是放在 /public 裡面，所以就設定 public

pipeline 的 Environment variables

之後在 pipeline 的環境變數加入

  • FIREBASE_CI_TOKEN
  • FIREBASE_PROJECT

FIREBASE_CI_TOKEN 填入剛剛你透過 $ firebase login:ci 所取得的 token，FIREBASE_PROJECT 則是你在 firebase 上的專案名稱

總結

之後你就可以在每次寫文章後，用 git push 之後，就會在 pipeline 上面 build 以及 deploy 了，但是需要注意 bitbucket 的 free plan 一個月只有 50 分鐘喔