vue-press 动态生成侧边栏遇到的坑

vuepress这个东西，刚开始接触也不知道这是什么。

在百度并查看文档之后，才知道原来这东西原来可以做博客呀，还可以做文档中心呢。

然后就一发不可收拾的走上不归之路。

环境配置啊，一些基础配置在官方文档中已经表明了，我就不多写了，中间自己做了一个根据文件自动生成侧边栏的方式。代码如下。

var sidebar = [];

const fig = [{
    index: 0,
    title: 'title1',
    name: "basics"
  },
  {
    index: 1,
    title: 'title2',
    name: "modeling"
  },
  {
    index: 2,
    title: 'title3',
    name: "web"
  },
]

fig.forEach((a, b) => {
  let name = '../pages/' + a.name; //拼接地址
  let defpath = path.resolve(__dirname, name);

  let data = {
    title: a.title,
    // path: defpath,  // path是个巨坑
    collapsable: true, // 不折叠
    sidebarDepth:1,
    children: []
  };
  const files = fs.readdirSync(defpath);
  if (files == null) {
    return;
  }
  files.forEach((c, d) => {
    let path = name + "/" + c;
    let headline = '';
    fs.readFile("docs/pages/" + a.name + '/' + c, function (err, datas) {
      if (err) {
        console.log(err, "文件不存在");
      } else {
        const html = marked.lexer(datas.toString());
        headline = html[0].text; //获取第一行文字
        //拼接
        data.children.push({
          title: headline,
          path: path
        })
        // res.json(str);
      }
    });
    console.log(data.children);
  })
  sidebar.push(data);
})

由于在配置sidebar的配置是，多加一个path 属性，导致了本地运行和发布之后，点击侧边栏的title会出现404.如下图

 在逐个排查中，终于发现由于我给title设置了path属性，导致点击无法找到路径，所以404出现。

特此记录此问题，有遇到相同问题的朋友，不妨可以试试注释掉代码中的path。