Electron開發實戰之記帳軟件16——使用Docsify生成文檔網站

代碼倉庫： https://github.com/hilanmiao/LanMiaoDesktop

官網中文文檔：https://docsify.js.org/#/zh-cn/quickstart

在平常開發中 先後端對接時 常常要寫不少文檔Api。docsify就是一個強大的文檔生成工具 界面清新好 支持語法高亮和Markdown 語法，而且docsify 擴展了一些 Markdown 語法能夠讓文檔更易讀。像vue.js官網(https://cn.vuejs.org/)就是docsify 其中的一種注意 而且是目前用的的最多的主題。

安裝docsify

npm i docsify-cli -g // 安裝全局
docsify init ./docs // 初始化項目
docsify serve docs // 本地預覽

初始化成功後，能夠看到 ./docs 目錄下建立的幾個文件

• index.html 入口文件
• README.md 會作爲主頁內容渲染
• .nojekyll 用於阻止 GitHub Pages 會忽略掉下劃線開頭的文件

初始化後默認是複製了根目錄下的ReadME.md,你能夠本身編輯。 本地預覽效果

部署Github pages

GitHub Pages 支持從三個地方讀取文件

docs/ 目錄 master 分支 gh-pages 分支 咱們推薦直接將文檔放在 docs/ 目錄下，在Setting頁面開啓 GitHub Pages 功能並選擇 master branch /docs folder 選項，馬上就能生成了。

能夠打開我github pages 預覽一下：https://hilanmiao.github.io/LanMiaoDesktop/#/

優化

docsify的配置項有不少，你能夠挨着試試，並且還有一些高級的功能，像ssr等，有興趣的本身研究下。

這是個人文件結構和最終效果展現，具體代碼請查看個人倉庫，直接拷貝過來用便可。