很多時候我們想需要一個地址就可以訪問自己的前端作品，
但是注冊一個服務器和域名是需要花錢，很多小伙伴都不願意，
其實這種前端靜態頁面github就可以幫我們預覽其效果，而且只要在有網的情況下都可以訪問的。
下面我就以vue.js為例，如何一步一步的在github上部署自己的前端項目的。
我的案例：https://husanfeng.github.io/vue-components-web/
首先你需要一個github賬號，所有還沒有的話先去注冊吧！
https://github.com/
我們使用git需要先安裝git工具，這里給出下載地址，下載后一路直接安裝即可：
https://git-for-windows.github.io/
1.1 創建一個本地項目
進到自己的本地項目文件下，右鍵-選擇git bash here（如下圖）
1.2 建立本地倉庫
如上點擊git bash here之后即可打開git客戶端黑窗口，
輸入命令： git init 初始化，
初始化成功后你會發現項目里多了一個隱藏文件夾.git（.git是隱藏文件，可通過設置顯示隱藏文件夾令其顯示）
然后，將項目中所有文件添加到倉庫
輸入指令： git add .（此處有空格）
注意： git是不能管理空的文件夾的，文件夾里必須有文件才能add
接着，把文件提交到倉庫，雙引號內是提交注釋。
輸入指令： git commit -m "注釋內容"
1.3 創建github倉庫
登錄個人github賬戶之后，選擇 New repository,
接着，根據提示創建一個倉庫
如此，一個名為vue-components-web的github倉庫就創建成功了
1.4 關聯github倉庫
復制github vue-components-web倉庫的倉庫地址，這里選擇的是http地址，這樣比較簡單，沒有選擇ssh，如有需要，可自行百度設置ssh，
獲取到github倉庫地址后，將本地倉庫與github倉庫關聯
輸入指令： git remote add origin http://github.com/husanfeng/vue-components-web.git
注：在git客戶端直接按 insert 即可粘貼內容
接下來彈出對話框輸入自己github帳號密碼；
關聯成功
1.5 上傳本地項目
輸入指令： git push -u origin master
稍等幾分鍾即可，
這樣本地代碼已經推送到github倉庫了，去githubt倉庫刷新即可。
2:如何在github上訪問自己的項目
2.1:創建gh-pages分支
2.2:在vscode上切換到gh-pages分支
2.3：將打包后的文件copy到gh-pages分支，在vscode上提交即可（記住打包文件放到gh-pages分支的根路徑，不然頁面出不來）
2.4：在github上切換到gh-pages分支，點擊Settng按鈕
2.5：選擇到gh-pages branch分支，點擊Save
點擊 https://husanfeng.github.io/vue-components-web/ 地址 就可以訪問了
