Auto-sidebar mode

[KraXen72]

Is your feature request related to a problem? Please describe.

Currently, the sidebar has to be manually kept in-sync with the markdown folders. this offers great control, but is annoying, if i just want the sidebar to always reflect my folders with the files in them

Describe the solution you'd like

a mode/flag on the sidebar where it would automatically generate depending on all the md files.
example folder structure:

example (desired sidebar):

i'd suggest, by default it takes all top level folders => categories and top level .md files in the folders => subheaders.
there could also be an option to specify a map/filter pass, for example to convert filenames separated with - to titles separated with space.

Describe alternatives you've considered

currently, i solved this by writing a generator script, but this is a thing many people would expect to be present by default, if the framework/ssg offers a sidebar.

my script: https://github.com/KraXen72/tech-support-wiki/blob/master/sidebar-generator.js

Additional context

it was a pain trying to figure out for half an hour that vitepress does not indeed support automatic sidebar.
also, it would be great to make it clearer that the .vitepress folder has to be inside of docs, struggled with that aswell

Validations

• Follow our Code of Conduct
• Read the docs.
• Read the Contributing Guidelines.
• Check that there isn't already an issue that asks for the same feature to avoid creating a duplicate.

[awbait]

the .vitepress folder doesn't have to be inside docs, change the startup script to "dev": "vitepress dev" and it will run from root directory

[Jimmylxue]

this can write an function to realization what you want it:

import slidebar from './sliderbar'

// config
const config = {
  // ...
  sidebar,
  // ...
}

export default config

sliderbar.js :

import { scanDir } from './util'

export default {
	'/': scanDir('article'),
	'/watermark/': scanDir('watermark'),
	'/snowtiny/': scanDir('snowtiny'),
	'/snow-react-markdown/': scanDir('snow-react-markdown'),
}

utils.js :

const fs = require('fs')
const path = require('path')
const { resolve } = path

export const scanDir = pathName => {
	const path = resolve(__dirname, `../../${pathName}`)
	return getMsg(path)
}

export const getMsg = path => {
	let res = fs.readdirSync(path).filter(item => !(String(item) === '.DS_Store'))
	if (res) {
		let arr = res.map(item => {
			if (String(item).endsWith('.md')) {
				return {
					text: item.split('.')[0],
					link: resolve(path, item),
				}
			} else {
				return {
					text: item.split('.')[0],
					items: getMsg(resolve(path, item)),
					collapsible: true,
				}
			}
		})
		arr = arr.map(item => {
			if (item.link) {
				item.link = translateDir(item.link)
			}
			return item
		})
		return arr
	} else {
		console.warn('无文章')
	}
}

/**
 *
 * @param {string} path
 * @returns
 */
function translateDir(path) {
	return path.replace(/\\/g, '/').split('docs')[1].split('.')[0]
}

// console.log("aaa", getMsg()[0]);
// module.exports = getMsg;

[KraXen72]

this is not ideal, because it dynamically generates the sidebar on-demain, making the whole site unable to be hosted as static on something like github pages. my script: https://github.com/KraXen72/tech-support-wiki/blob/master/sidebar-generator.js uses user's local node.js install to pre-generate the sidebar before pushing. however, it would be best if vitepress included this out of the box

[Akryum]

because it dynamically generates the sidebar on-demain

That is incorrect, it happens during build time only, so it would be fine on a static hosting.

[basefas]

need this feature too

[brc-dd]

Duplicate of #1297