用docsify快速構建文檔,並用GitHub Pages展示


什么是docsify

無需構建,寫完 markdown 直接發布成文檔,寫說明文檔的極佳選擇。

快速上手

安裝

npm i docsify-cli -g
docsify init docs

創建項目

新建一個空項目,接着創建一個 docs 目錄並進入到 docs 目錄下

mkdir my-project && cd my-project
mkdir docs && cd docs

創建入口文件

根目錄下創建index.html 文件

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>li.css</title>
  <meta name="description" content="Description">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <link rel="stylesheet" href="//unpkg.com/docsify/themes/vue.css">
</head>
<body>
  <div id="app"></div>
</body>
<script src="//unpkg.com/docsify/lib/docsify.js" data-router data-repo="https://helijun.github.io/pages/docs/index.html"></script>
</html>

預覽

docsify serve docs

docsify自動監聽3000端口,瀏覽器輸入 http://localhost:3000
就可以看到你在README.md里面編輯的內容了

發布到 GitHub Page

將文檔托管到github,這樣就可以隨時隨地訪問了。
新建一個倉庫,在setting里面開啟 GitHub Pages 功能,如圖:

瀏覽器輸入https://helijun.github.io/pages/. 就可以看到你的文檔了,當然如果你這個倉庫包含了其他的文檔的話 select source那里選擇master branch,這樣就不會影響其他文檔的瀏覽,比如我的最終鏈接是 https://helijun.github.io/pages/docs/index.html#/,暫時存放LIUI的草稿文檔

其他參考

官方文檔:https://docsify.js.org/zh-cn


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM