如何自己創(chuàng)建網(wǎng)站？文檔是幫助用戶使用開源項目的一個重要部分，但它并不總是開發(fā)人員的首要任務(wù)，因為他們可能更關(guān)心如何使他們的應(yīng)用程序更好地使用它。這就是為什么開發(fā)人員可以更容易地發(fā)布文檔。在本教程中，我將向您展示一種方法：如何自己創(chuàng)建網(wǎng)站。

如何使用docsify和GitHub頁面創(chuàng)建文檔網(wǎng)站？

默認情況下，githubpages會提示用戶使用Jekyll，一個支持HTML、CSS和其他web技術(shù)的靜態(tài)網(wǎng)站生成器。Jekyll可以從以降價格式編碼的文檔文件生成一個靜態(tài)網(wǎng)站，GitHub將自動識別它們。MD或。降價擴展。這是一個很好的設(shè)置，但我想試試別的。

幸運的是，githubpages支持HTML文件，這意味著您可以使用docsify等其他站點生成工具在這個平臺上創(chuàng)建一個網(wǎng)站。Docsify是一個擁有MIT許可證的開源項目，它可以很容易地在githubpages上創(chuàng)建一個有吸引力的***文檔網(wǎng)站。

文件

安裝docsify有兩種方法：

Docsify推薦NPM，但我將使用第二個選項。如果要使用NPM，請按照快速入門指南中的說明進行操作。

我已經(jīng)在項目的GitHub頁面上發(fā)布了這個示例的源代碼。您可以單獨下載這些文件，也可以通過以下方式克隆存儲庫。

然后CD進入docsifydemo目錄。

如果您克隆我的GitHub存儲庫并切換到docsifydemo目錄，您應(yīng)該會看到以下文件結(jié)構(gòu)：

文件內(nèi)容包含在ClonedWithub中

這基本上只是一個普通的HTML文件，但是看看這兩行：

這些行使用內(nèi)容交付網(wǎng)絡(luò)（CDN）的URL來提供CSS和JavaScript腳本來將站點轉(zhuǎn)換為docsify站點。只要包含這些行，就可以將常規(guī)GitHub頁面轉(zhuǎn)換為文檔頁面。

body標記后的***行指定要呈現(xiàn)的內(nèi)容：

Docsify使用單頁應(yīng)用程序（SPA）呈現(xiàn)請求的頁面，而不是刷新新頁面。

***，查看腳本塊中的行：

在此區(qū)塊中：

您可以在docsify文檔的配置部分找到所有選項。

它使用markdown的鏈接格式來創(chuàng)建導(dǎo)航。請注意，tomcat、cloud和Java等鏈接是縮進的；這意味著它們在父鏈接下呈現(xiàn)為子鏈接。

圖像自述文件.md像和圖像這樣的文件與存儲庫的結(jié)構(gòu)有關(guān)，但所有其他的降價文件都與docsify網(wǎng)頁相關(guān)。

根據(jù)您的需要，請隨意修改您下載的文件。接下來，將這些文件添加到GitHub存儲庫中，啟用githubpages，并完成項目。

創(chuàng)建示例GitHub存儲庫，并使用以下GitHub命令簽出、提交和推送代碼：

設(shè)置githubpages頁面。在新的GitHub存儲庫中，單擊“設(shè)置”：

設(shè)置鏈接到Sub

向下滾動直到看到githubpages：

GithubPages設(shè)置

“查找”部分：

GithubPages設(shè)置

單擊“源”下的下拉菜單。通常，您會將其設(shè)置為“主分支”，但如果您愿意，也可以使用其他分支：

設(shè)置SourceToMasterBranch

就這樣！現(xiàn)在應(yīng)該有一個鏈接到githubpages的頁面。單擊此鏈接將帶您到那里，然后使用docsify呈現(xiàn)它：

鏈接到SubpagesDocssite

應(yīng)該是這樣的：

示例Docsifysiteongitubpage

如何自己創(chuàng)建網(wǎng)站？通過編輯HTML文件和一些降價文本，您可以使用docsify創(chuàng)建一個外觀漂亮的文檔網(wǎng)站。你覺得怎么樣？請留言并分享其他可以與githubpages一起使用的開源工具。