隨著學習知識的積累,我們需要掌握的知識越來越多,這是就有一個問題出現了,如何把我們學習到的知識整理起來,讓我們更方便的去管理和閱讀,同事還想把我們所學習到的知識分析個小伙伴。這是我們就需要一個很方便的味文檔管理工具了,在這裡就給大家介紹一個款線上免費開源的文檔管工具【Docsify-Plus文檔工具 ...
隨著學習知識的積累,我們需要掌握的知識越來越多,這是就有一個問題出現了,如何把我們學習到的知識整理起來,讓我們更方便的去管理和閱讀,同事還想把我們所學習到的知識分析個小伙伴。這是我們就需要一個很方便的味文檔管理工具了,在這裡就給大家介紹一個款線上免費開源的文檔管工具【Docsify-Plus文檔工具】。
【Docsify-Plus文檔工具】是本人搭建的一款開箱即用的文檔工具,只需下載源碼 直接運行即可,無需編寫代碼,只需修改少量配置就可以搭建起自己的文檔工具,配合【Gitee Pages】實現了低成本工具。
Docsify-Plus文檔工具 是基於Docsify.js 配置的一套開源框架,實現了直接使用 Markdown標記語言發佈文檔。無需對Markdown文檔進行任何的修改,直接在項目中創建.md的Markdown文檔編輯,直接發佈Markdown,發佈完後直接訪問項目即可。
docsify 可以快速幫你生成文檔網站。不同於 GitBook、Hexo 的地方是它不會生成靜態的 .html
文件,所有轉換工作都是在運行時。如果你想要開始使用它,只需要創建一個 index.html
就可以開始編寫文檔並直接部署。
Docsify-Plus部署
Docsify-Plus文檔更適合做幫助文檔和筆記工具,還支持多種部署方式,
Docsify-Plus表情
Docsify-Plus文檔預設配置有一百多個表情,豐富你的文檔記錄
Docsify-Plus開發教程
Docsify-Plus開發需要使用到node 開發環境,和docsify-cli依賴包
安裝node環境
安裝docsify-cli
之前,我們需要安裝npm
包管理器,而安裝了node.js
就會自動安裝npm
安裝node
官網下載安裝程式,雙擊下載的exe安裝,下一步下一步直到完成。
驗證安裝
輸入node -v,npm -v輸出版本就是安裝成功了
#驗證node node -v #驗證npm npm -v
安裝docsify-cli工具
推薦全局安裝 docsify-cli
工具,可以方便地創建及在本地預覽生成的文檔。
#用npm安裝全局工具 npm i docsify-cli -g
下載Docsify-Plus項目
Gitee地址: https://gitee.com/librarycodes/docsify-plus GitHub地址: https://github.com/shiming-git/docsify-plus
運行Docsify-Plus項目
預設運行埠為 3000 docs為Docsify-Plus的預設目錄,此目錄可自行更改,可改為更目錄
#進入項目 cd docsify serve docs #啟動項目 docsify serve docs
指定埠運行
-p 80 指定運行埠 為 80
docsify serve -p 80 docs
本地預覽
游覽器打開輸入訪問地址,http://{你的ID地址}:{你指定的埠}
http://localhost:3000
Docsify-Plus開發
目錄介紹
docsify-plus #項目 |__ docs #文檔目錄 可選 |__ contents #文檔文件夾 可選 |__ development.md #快速開始 頁面文件 |__ guide.md #指南 頁面文件 |__ zh-en #不同語言目錄 可選 |__ _coverpage.md #當前語言封面 |__ _navbar.md #當前語言導航頁面 |__ _sidebar.md #當前語言菜單頁面 |__ README.md #當前語言首頁面 |__ 404.md #錯誤頁面 可選 |__ _coverpage.md #預設語言封面 可選 |__ _navbar.md #預設語言導航 可選 |__ _sidebar.md #預設語言菜單 可選 |__ index.html #程式入口 必選 可配置 |__ README.md #預設語言首頁 可選 |__ .nojekyll #git配置 |__ LICENSE #git配置 |__ README.md #git說明頁面
菜單列表路徑
你可以簡單地在你的 docsify 目錄中創建更多的 markdown 文件,你可以在菜單_sidebar.md添加目錄,系統菜單是以 相對路徑 訪問頁面
將你自定義的菜單文件添加到菜單列表中 就可以預覽文件內容了,項目 目錄不是固定的開發者可根據自己的需要去修改文件路徑,最終要將文件相對路徑添加到菜單列表即可。
* [介紹](README.md) * [快速開始](contents/development) * [指南](contents/guide)
從側邊欄選擇設置頁面標題
頁面的title
標簽是從選定的側邊欄項目名稱生成的。為了更好的顯示,您可以通過在文件名後指定一個字元串來自定義標題。
* [指南](contents/guide "文檔指南")
Docsify-Plus部署到gitee
windows安裝git,管理頁面
window上主要是日常博客的編寫,然後用git來管理,上傳到gitee後,可以配置生成GiteePages。具體的git操作和配置可以參考git詳解文章,這裡創建了一個gitee倉庫,專門用來做個人網站。下麵紅框框出來的是docsify生成的幾個配置文件。
Gitee配置Gitee Pages
第一次配置需要實名認證,上傳身份證正反面,手持身份證照片。
部署選擇你要部署的分支,部署的目錄就是docsify對應倉庫中的目錄,我這邊是整個倉庫作為docsify目錄,建議強制使用https勾選,然後就可以啟動。
頁面效果請參考
生成的giteePages地址是https://bluecusliyou.gitee.io/techlearn
頁面修改更新
如果頁面內容有修改更新到倉庫了,可以點擊更新個人頁面
好東西話不多說直接上源碼。
Docsify-Plus演示:https://gitee.com/librarycodes/docsify-plus
Gitee源碼地址:https://gitee.com/librarycodes/docsify-plus
GitHub源碼地址:https://gitee.com/librarycodes/docsify-plus
Docsify官網:https://docsify.js.org/#/