构建结构化站点的核心配置和约定 |
您所在的位置：网站首页 › vuejs3x › 构建结构化站点的核心配置和约定 |
|
本主题遵循“约定优于配置”原则，如果你想构建一个结构化的站点，需要遵循下面这些约定，约定可以为你省去很多配置，轻松拥有一个结构清晰的站点。 你需要在config.js中有如下配置： // config.js module.exports = { themeConfig: { sidebar: 'structuring' // 'structuring' | { mode: 'structuring', collapsable: Boolean} | 'auto' | 自定义 } }在运行开发服务npm run dev或打包npm run build时主题内部将会按照目录约定自动生成一个结构化的侧边栏、目录页、面包屑等数据。 在源目录（一般是docs）文件夹中，除了.vuepress、@pages、_posts、index.md 或 README.md之外的文件夹将会为其生成对应的侧边栏。生成的顺序取自序号，标题取自文件（夹）名称。 # 命名约定 无论是文件还是文件夹，请为其名称添加上正确的正整数序号和.，从00或01开始累计，如01.文件夹、02.文件.md，我们将会按照序号的顺序来决定其在侧边栏当中的顺序。 同一级别目录别内即使只有一个文件或文件夹也要为其加上序号。提示 序号只是用于决定先后顺序，并不一定需要连着，如01、02、03...，实际工作中可能会在两个文章中间插入一篇新的文章，因此为了方便可以采用间隔序号10、20、30...，后面如果需要在10和20中间插入一篇新文章，可以给定序号15。 # 级别说明源目录（一般是docs）底下的级别现在我们称之为一级目录，一级目录的下一级为二级目录，以此类推，最多只能到四级目录。 一级目录 .vuepress、@pages、_posts、index.md 或 README.md 这些文件(文件夹)不参与数据生成。 序号非必须。（如一些专栏，可以不用序号) 二级目录 该级别下可以同时放文件夹和.md文件，但是两者序号要连贯（参考下面的例子中的其他）。 必须有序号 三级目录 (同上) 四级目录 v1.6.0 + 该级别下只能放.md文件。 必须有序号所有级别内至少有一个文件或文件夹。 # 目录结构例子 . ├── docs │ │ (不参与数据生成) │ ├── .vuepress │ ├── @pages │ ├── _posts │ ├── index.md │ │ │ │ (以下部分参与数据生成) │ ├── 《JavaScript教程》专栏 (一级目录) │ │ ├── 01.章节1 (二级目录) │ │ | ├── 01.js1.md (三级目录-文件) │ │ | ├── 02.js2.md │ │ | └── 03.js3.md │ │ └── 02.章节2 (二级目录) │ │ | ├── 01.jsa.md │ │ | ├── 02.小节 (三级目录) │ │ | | └── 01.jsxx.md (四级目录-文件) │ ├── 01.前端 │ │ ├── 01.JavaScript │ │ | ├── 01.js1.md │ │ | ├── 02.js2.md │ │ | └── 03.js3.md │ │ └── 02.vue │ │ | ├── 01.vue1.md │ │ | └── 02.vue2.md │ ├── 02.其他 │ │ ├── 01.学习 │ │ | ├── 01.xxa.md │ │ | └── 02.xxb.md │ │ ├── 02.学习笔记 │ │ | ├── 01.xxa.md │ │ | └── 02.xxb.md │ │ ├── 03.文件x.md │ │ └── 04.文件xx.md │ └── 03.关于我 │ │ └── 01.关于我.md . . # 如何知道侧边栏数据有没有正确生成？在运行开发服务时(npm run dev)，在命令行查看打印记录，如果正确生成会有这样的绿色提示记录： tip: add sidebar data. 侧边栏数据添加成功。如果有未按约定的文件，会有黄色警告记录，如： warning: 该文件'xxx'序号出错，请填写正确的序号。 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |