因為某些原因，我決定來試試把之前用 webpack 配置的 Vue 專案丟到 github page 上。
不過網路上找到的文章大部分介紹的都是使用 Vue CLI。
剛好有時間，摸索一下囉。
原來的專案 code 在 這邊 ，一字不改的拉下來。
然後在 github 上開一個新的 repository。
以我為例，把這個新的 repository 命名為 portfolioPage。
注意要開一個新的，我一開始開在其他 repository 下面，作為子資料夾，然後......然後我最後就決定開一個新的了(哈。
(路徑上設定會比較複雜，我放棄研究)
專案裡面的 code 都沒調整，只有參考 一個指令快速部署 Vue Cli 到 GitHub Pages 配置了 deploy.sh，我是採用第二種方法。
都推上去之後，下指令
沒問題的話，執行結束後可以看到 github 頁面上已經創立了 gh-page 分支。
到這邊其實已經可以查看頁面了，以我為例是
https://second9040.github.io/portfolioPage
second9040 的地方是你的 github 帳號，
portfolioPage 替換成前面訂好的 repository 名字。
如果頁面 404，可以檢查一下 github > setting 有沒有開啟 github page 了，或是分支是否選成了 master 之類的 (要選 gh-page 才對)。
如果照的我原本的專案配置，會發現看不見圖片。路徑不對。
怎麼辦呢？
把 router mode 從 history 改成 hash 就可以了喔!!
完成之後就有一個堪用的，放在 github page 上可供作妖的專案啦~
附上 code 提供參考。
成品頁面經過魔改，最後出來的東西跟一開始差蠻多了。
最後講一下：
找資料的時候有找到蠻多文章是部屬時在 config 多設置一個 publicPath，因為 vue 官網就是這麼寫的(笑)
CLI 可以直接
publicPath: process.env.NODE_ENV === 'production'
? '/my-project/'
: '/'
}
自己配置的話則要放在 config.output 裡。
然後最後我發現只要 router mode 改成 hash 就可以解決我遇到的問題，所以我就拿掉了，主要是因為我從頭到尾沒找到能讓我圖片出現的 publicPath(笑)
參考文章