VuePress 配置文件 config.js

VuePress的配置文件放在.vuepress目錄，名稱為config.js。

在配置文件中可以設定如導覽列(NavBar)，側邊欄(SideBar)，主題(Theme)配置等。

延續前一篇「建立 VuePress 網站」，下面示範如合在VuePress網站增加預設主題的導覽列。

在/docs目錄下新增/.vuepress目錄，並在/.vuepress目錄新增config.js，所以就是/docs/.vuepress/config.js。

在config.js設定導覽列的配置themeConfig.nav如下。

Config.js

module.exports = {
  themeConfig: {
    nav: [
      { text: 'Home', link: '/' }, // 到README.md
      { text: 'Guide', link: '/guide/' }, // 到/docs/guide.md
      { text: 'VuePress', link: 'https://vuepress.vuejs.org/' } // 外部連結
    ]
  }
}

在/docs目錄guide.md內容如下，此即為導覽列[Guide]所指向的位置。

# Guide

設定完後即可在頁面右上方看到導覽列標籤，點選標籤文字可導向link指向的資源位置。

目錄結構如下。

demo
├─ docs
│  ├─ .vuepress
│  │  └─ config.js
│  ├─ guide.md
│  └─ README.md
├─ node_modules
├─ package.json
└─ yarn.lock

詳細參考github。

• VuePress - 基本配置
• VuePress - 导航栏链接