# config.js配置教程

## 设置站点根路径
- 如果访问的时候是ip+端口，那么这里就是**/**，如果访问的是ip+端口+工程名，那么这里就是 **/工程名/**
- 这是部署到github相关的配置

```
module.exports = {
  base:'/',
 }
```

## 设置编译后的输出目录
- **./ROOT**代表在工程的根目录下生成一个ROOT文件，里面是编译好的文件，可以拿ROOT直接部署。

```
module.exports = {
  dest:'./ROOT',
 }
```

## 本地调试的端口号，默认是8080

```
module.exports = {
  port:8086,
 }
```

## 代码块显示行号

```
module.exports = {
markdown: {
    lineNumbers: true // 代码块显示行号
 }
}
```

## 页面路由地址对应写法

| 文件的相对路径  |  页面路由地址 |
| :------------ | :------------ |
|  /README.md |  / |
| /guide/README.md  | /guide/  |
| /config.md  |  /config.html |

## 网页标签的图标
- 这里的 '/' 指向 docs/.vuepress/public 文件目录 ，即 docs/.vuepress/public/logo.png

```
themeConfig: {
    head: [
      ['link', {rel: 'icon', href: '/logo.png'}],
    ],
}
```

## 导航栏Logo

```
 themeConfig: {
    logo:'/logo.png',
}
```

![](/navLogo.png)

## nav配置【右上角的导航条】

```
themeConfig: {
	nav:
      [
        {text: "首页", link: "/"},
        {text: "指南", link: "/wiki/introduce/"},
        {text: "博客", link: "https://blog.isww.cn/"}
      ],
}
```

## 侧边栏配置
### 设置左侧导航显示的层级 
- sidebarDepth: 2
- 一般是以单个md文件中的 # ## ### #### 这几个标题文字为锚点自动生成导航
- 0读取1级标题
- 1读取1级和2级标题
- 2读取1级、2级、3级标题

### 设置侧边栏内容
- 根据自己的需求来订，对应自己在docs下的文件夹名，默认首页是README.md  【/wiki/introduce/ 相当于 /wiki/introduce/README.md】效果如下图：
- 【注】其中侧边栏除了config.js下的title外的导航栏目是根据该目录(例如：/wiki/introduce/)下的一级、二级、三级和四级标题所自动生成的导航栏目，所以**侧边栏只需要在config.js配置页面路由地址及title即可**

```
themeConfig: {
sidebar: [
      {
        title: '文档',
        collapsable: false,
        children: [
          '/wiki/introduce/',
          '/wiki/back-build/',
		  {
            title: "侧边栏组合",
            collapsable: false,
            children: [
              "/second/child/"
            ]
          }
        ]
      },
 ]
 }
```



## 底部设置最后更新时间

```
themeConfig: {
    //最后更新时间
    lastUpdated: 'Last Updated',
}
```