VuePress是一個(gè)由 Vue、Vue Router 和 webpack 驅(qū)動(dòng)的單頁應(yīng)用;同時(shí)它擁有一套書寫技術(shù)文檔的默認(rèn)主題,它的誕生初衷是為了支持 Vue 及其子項(xiàng)目的文檔需求,當(dāng)然也可以用于別的語言項(xiàng)目。
了解Vue.js可以看看這篇文章,熟練者跳過此部
特性:
- markdown編寫文檔,直接轉(zhuǎn)換HTML
- 對(duì)SEO友好
- 單頁面響應(yīng)快
- 省資源
- 獲取資源方式往下看↓↓↓↓↓↓↓
- 純前端
- 無需數(shù)據(jù)庫
演示:
首頁
左側(cè)導(dǎo)航
MarkDown文檔
部署:
# 將 VuePress 作為一個(gè)本地依賴安裝
yarn add -D vuepress # 或者:npm install -D vuepress
# 新建一個(gè) docs 文件夾
mkdir docs
# 新建一個(gè) markdown 文件
echo \’# Hello VuePress!\’ > docs/README.md
接著,在 package.json 里加一些腳本:
{ \”scripts\”: { \”docs:dev\”: \”vuepress dev docs\”, \”docs:build\”: \”vuepress build docs\” }}
然后就可以開始寫作了:
yarn docs:dev # 或者:npm run docs:dev
要生成靜態(tài)的 HTML 文件,運(yùn)行:
yarn docs:build # 或者:npm run docs:build
默認(rèn)情況下,文件將會(huì)被生成在 .vuepress/dist,當(dāng)然,你也可以通過 .vuepress/config.js 中的 dest 字段來修改,生成的文件可以部署到任意的靜態(tài)文件服務(wù)器上
目錄結(jié)構(gòu):
├─ docs│ ├─ README.md│ └─ .vuepress│ └─ config.js└─ package.json
配置:
module.exports = { title: \’文檔管理\’, //項(xiàng)目名稱 description: \’\’, themeConfig: { nav: [ //頂部菜單 { text: \’主頁\’, link: \’/\’ }, { text: \’Java\’, items: [ { text: \’SpringBoot\’, link: \’/SpringBoot/\’ }, { text: \’SpringCloud\’, link: \’/SpringCloud/\’ } ] }, { text: \’關(guān)于\’, link: \’/about\’ } ], search: false,//是否開啟搜索 searchMaxSuggestions: 10, sidebar: { //側(cè)邊欄菜單 \’/SpringBoot/\’: [ \’\’, \’microservices-introduction\’ ], \’/SpringCloud/\’: [ \’\’, \’distributed-lock-redis-vs-zookeeper\’, \’distributed-session\’ ], \’/\’: [ \’about\’ ] }, lastUpdated: \’Last Updated\’, }}
獲取方式
關(guān)注 轉(zhuǎn)發(fā) 私信“vuepress”,自動(dòng)發(fā)送資源地址
另一個(gè)Vue.js SpringBoot的文檔管理系統(tǒng)
搭建文檔管理系統(tǒng)幫助團(tuán)隊(duì)構(gòu)建一個(gè)信息共享文檔管理的協(xié)作環(huán)境
版權(quán)聲明:本文內(nèi)容由互聯(lián)網(wǎng)用戶自發(fā)貢獻(xiàn),該文觀點(diǎn)僅代表作者本人。本站僅提供信息存儲(chǔ)空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如發(fā)現(xiàn)本站有涉嫌抄襲侵權(quán)/違法違規(guī)的內(nèi)容, 請(qǐng)發(fā)送郵件至 舉報(bào),一經(jīng)查實(shí),本站將立刻刪除。