用docsify快速構建文檔，並用GitHub Pages展現

時間 2019-12-01

標籤 docsify 快速構建文檔並用 github pages 展現欄目 Git 简体版

原文原文鏈接

什麼是docsify

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

快速上手

安裝

npm i docsify-cli -g
docsify init docshtml

建立項目

新建一個空項目，接着建立一個 docs 目錄並進入到 docs 目錄下vue

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

建立入口文件

根目錄下建立index.html 文件github

<!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 docsnpm

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

發佈到 GitHub Page

將文檔託管到github，這樣就能夠隨時隨地訪問了。
新建一個倉庫，在setting裏面開啓 GitHub Pages 功能，如圖：markdown

瀏覽器輸入https://helijun.github.io/pages/. 就能夠看到你的文檔了，固然若是你這個倉庫包含了其餘的文檔的話 select source那裏選擇master branch，這樣就不會影響其餘文檔的瀏覽，好比個人最終連接是 https://helijun.github.io/pages/docs/index.html#/，暫時存放LIUI的草稿文檔app