VuePress是一個由 Vue、Vue Router 和 webpack 驅(qū)動的單頁應(yīng)用；同時它擁有一套書寫技術(shù)文檔的默認(rèn)主題，它的誕生初衷是為了支持 Vue 及其子項目的文檔需求，當(dāng)然也可以用于別的語言項目。

了解Vue.js可以看看這篇文章，熟練者跳過此部

Vue.js快速入門就從這兒開始特別是后端程序員

特性：

• markdown編寫文檔，直接轉(zhuǎn)換HTML
• 對SEO友好
• 單頁面響應(yīng)快
• 省資源
• 獲取資源方式往下看↓↓↓↓↓↓↓
• 純前端
• 無需數(shù)據(jù)庫

演示：

首頁

左側(cè)導(dǎo)航

MarkDown文檔

部署：

# 將 VuePress 作為一個本地依賴安裝

yarn add -D vuepress # 或者：npm install -D vuepress

# 新建一個 docs 文件夾

mkdir docs

# 新建一個 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)情況下，文件將會被生成在 .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: ‘文檔管理’, //項目名稱 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”，自動發(fā)送資源地址

另一個Vue.js SpringBoot的文檔管理系統(tǒng)

搭建文檔管理系統(tǒng)幫助團(tuán)隊構(gòu)建一個信息共享文檔管理的協(xié)作環(huán)境