Автоматически добавлять новые сообщения в боковую панель

Question

Я использую VuePress и NetlifyCMS в качестве управления контентом.

У меня есть 3 коллекции ( design , front-end и back-end ), которые содержат неограниченное количество страниц. Эти страницы создаются с помощью панели инструментов NetlifyCMS и добавляются в указанную папку.

• Добавлены новые страницы дизайна в папку design .
• Новые интерфейсные страницы добавляются в папку front-end .
• [...]

Это отлично работает, но я столкнулся с проблемой.
Поскольку мои новые страницы не определены в конфигурации боковой панели, они не доступны из интерфейса боковой панели. Как я могу сделать это, сохраняя тот же формат боковой панели, как показано ниже?

config.js

[...],
sidebar: {
  '/design/': [{
    title: 'Design',
    children: [
      '',
      'foo 1',
      'foo 2'
    ]
  }],
  '/front-end/': [{
    title: 'Front-end',
    children: [
      '',
      'bar 1',
      'bar 2'
    ]
  }],
  '/back-end/': [{
    title: 'Back-end',
    children: [
      '',
      'baz 1',
      'baz 2'
    ]
  }]
},
[...]

---

config.yml

[...],
collections:
  - name: "design"
    label: "Design"
    folder: "docs/design"
    create: true
    slug: "{{slug}}"
    fields:
      - {label: "Title", name: "title", widget: "string"}
      - {label: "Body", name: "body", widget: "markdown"}
  - name: "front-end"
    label: "Front-end"
    folder: "docs/front-end"
    create: true
    slug: "{{slug}}"
    fields:
      - {label: "Title", name: "title", widget: "string"}
      - {label: "Body", name: "body", widget: "markdown"}
  - name: "back-end"
    label: "Back-end"
    folder: "docs/back-end"
    create: true
    slug: "{{slug}}"
    fields:
      - {label: "Title", name: "title", widget: "string"}
      - {label: "Body", name: "body", widget: "markdown"}

Answer 1

Один из способов - импортировать ваши имена файлов в конфигурацию при сборке.

Добавить скрипт в папку docs/.vuepress:

docs/.vuepress/childscript.js

var fs = require('fs');

module.exports = function(path) {
  var files = fs.readdirSync(path);
  var list = [""];
  for (var i in files) {
    var filename = files[i].split('.').slice(0, -1).join('.');
    if (filename.toLowerCase() !=="readme") list.push(filename);
  }
  console.log(`${path}: `, list);
  return list;
}

Тогда измени свой docs/.vuepress/config.js

var getChildren = require('./childscript');

[...],
sidebar: {
  '/design/': [{
    title: 'Design',
    children: getChildren('./docs/design/')
  }],
  '/front-end/': [{
    title: 'Front-end',
    children: getChildren('./docs/front-end/')
  }],
  '/back-end/': [{
    title: 'Back-end',
    children: getChildren('./docs/back-end/')
  }]
},
[...]

ПРИМЕЧАНИЕ: Здесь указывается порядок сортировки имен файлов во время чтения каталога.