當網頁已經開發完成了，通常會想找個網路空間把網頁放上去，讓其他人輸入網址後就能在遠方看到網頁。網路雖然是自由的，但卻不是免費的，許多的網路空間都需要花錢錢才能使用。
不過，github 有提供一個免費託管靜態網頁的服務：github pages。透過這個服務，就能免費地將靜態網頁放上去，不用擔心伺服器費用的問題惹。
github pages 可以直接透過網頁、git 命令就能操作，先了解 github pages 的操作方式，就更能了解 gulp 的自動化流程該怎麼與 github pages 連動。
不過這邊就只列出簡要的步驟惹。詳細的操作步驟可 google 或參考置底的資料
git clone xxx.git
# CLI
git add --all
git commit -m "Initial commit"
git push -u origin master
先安裝這個套件
# CLI
npm install --save-dev gulp-gh-pages
在 gulpfile 加入語法
var gulp = require('gulp');
var ghPages = require('gulp-gh-pages');
function deploy() {
return gulp.src("./public/**/*").pipe($.ghPages())
}
exports.deploy = deploy
之後就能在 CLI 中下指令，將編譯好的網頁推到 github pages 上，讓大家都能看到網頁了
gulp deploy
雖然這篇介紹到如何使用 gulp-gh-pages，將編譯好的靜態網頁佈署到 github pages，但這邊想留點提醒給想要嘗試的人：
一、這個套件沒有更新的很頻繁。github 上的最新更新是 2018 年，而 npm 上的最新更新則是 2015 年。雖然 gulp 也沒有什麼在更新啦(?)，但有點擔心當出現 bug 時，這個套件沒辦法即時處理掉。(而且該套件的 repo 沒有看到能反應 issue 的地方 @@)
二、我前幾個月嘗試使用該套件時失敗了。我不太確定原因是什麼，不曉得是不是該套件不支援 gulp4、或是不支援佈署到自己的私人專案。
因此若想省時間使用這個套件之前，最好還是先跑過 git CLI 的流程，除了更了解佈署到 github pages 的原理外，也能當作是該套件失效時的一個備案。
今天談到了如何用 gulp-gh-pages，將編譯好的靜態網頁佈署到 github pages 上。明天將會講完賽心得。
其實這個套件一直有一個問題，在初次安裝時可能沒問題，但是在後來有可能會出現錯誤，這個問題我滿常遇見的(常常無聊回去優化以前寫的專案
喔喔喔感謝!
我前幾個月嘗試到崩潰，也沒順利 google 到解決方案
我後來是另外寫 bash 檔來解決的 orz
git checkout -B gh-pages
git add -f public
git commit -m "compile website"
git push origin `git subtree split --prefix public gh-pages`:gh-pages --force
git checkout master
read -n1 -r -p "Press any key to continue..." key
之後有空再來研讀你的 Heroku 番外篇 ~
iThome鐵人賽
看影片追技術