1. 前言
作為一個(gè)前端程序員损敷，使用github的倉(cāng)庫(kù)(repositories)來(lái)托管代碼是一件再正常不過(guò)的事情了。很多的前端都會(huì)將自己的工程代碼push到github上。然而上傳之后發(fā)現(xiàn)自己的html文檔是這樣被顯示的：
發(fā)現(xiàn)點(diǎn)開(kāi)之后只有html的源代碼灶似，并沒(méi)有能預(yù)覽的界面记某。那么如何能正確的預(yù)覽項(xiàng)目中的html網(wǎng)頁(yè)呢？
好在github已經(jīng)推出了 GitHub Pages 功能，讓大家方便的預(yù)覽自己的 HTML。下面就給大家做一個(gè)簡(jiǎn)易教程。
2. 預(yù)覽方法
-
登錄github淑掌，點(diǎn)擊新建倉(cāng)庫(kù)(repositories)，如下圖所示：
點(diǎn)擊新建倉(cāng)庫(kù) -
新建一個(gè)倉(cāng)庫(kù)(repositories):
新建一個(gè)倉(cāng)庫(kù) -
在倉(cāng)庫(kù)中進(jìn)入setting界面
進(jìn)入setting界面 -
在setting界面中往下翻蝶念，找到并開(kāi)啟 GitHub Pages 功能抛腕，得到一個(gè)「預(yù)覽地址」，我的「預(yù)覽地址」是https://tinyfatboy.github.io/PageDemos/
開(kāi)啟GitHub Pages 功能 -
得到「預(yù)覽地址」后就可以根據(jù)相對(duì)路徑來(lái)預(yù)覽自己的html文檔了媒殉，我們先在倉(cāng)庫(kù)中新建一個(gè)test.html:
新建test.html文件1
新建test.html文件2 -
編輯好后點(diǎn)擊下方的create new file即可創(chuàng)建文件担敌，根據(jù)剛才創(chuàng)建的文件名稱(chēng)的相對(duì)路徑就可以用「預(yù)覽地址」來(lái)預(yù)覽html文件了
頁(yè)面地址
在瀏覽器輸入: https://tinyfatboy.github.io/PageDemos/test.html 進(jìn)行預(yù)覽預(yù)覽頁(yè)面
