vite-plugin-vitepress-auto-sidebar
vite-plugin-vitepress-auto-sidebar copied to clipboard
QC2168
The vite plugin that automatically generates sidebar data by scanning directories, based on vitepress
vite-plugin-vitepress-auto-sidebar
The vite plugin that automatically generates sidebar data by scanning directories, based on vitepress
✨ Feature
🚀 Automatically create the sidebar data and injected into config.ThemeConfig.sidebar
🤖 Listen globally for *.md files to automatically update sidebar data when they are added or deleted
🕯️ Usage
install vite-plugin-vitepress-auto-sidebar
# recommend using pnpm packageManager
pnpm i vite-plugin-vitepress-auto-sidebar
# or yarn
yarn add vite-plugin-vitepress-auto-sidebar
# or npm
npm install vite-plugin-vitepress-auto-sidebar
add plugin in .vitepress/config.ts
import AutoSidebar from 'vite-plugin-vitepress-auto-sidebar';
export default defineConfig({
vite: {
plugins: [
// add plugin
AutoSidebar({
// You can also set options to adjust sidebar data
// see option document below
})
]
},
})
Warning, you must clear the sidebar objects in the config.ts or it may not work properly
pnpm run dev
[auto-sidebar] injected sidebar data successfully
If you see the above message, it means the plugin is working properly, otherwise there may be a problem
🛠️ Options
Parameters
| name | description | type | default |
|---|---|---|---|
| ignoreList | ignore specified folder | string[] |
true |
| path | create scan path for the sidebar | string |
/docs |
| scanRootMdFiles | scan the md file in path | boolean |
true |
| ignoreIndexItem | ignore the page sidebar with only index.md | boolean |
false |
| collapsed | By adding collapsed option to the sidebar group, it shows a toggle button to hide/show each section,For specific usage, please refer to VitePress | boolean |
false |
| deletePrefix | deletes the md file prefix | string |
|
| titleFromFile | read title from md file | boolean |
false |
| titleFromFileByYaml | read title from yaml config | boolean |
false |
Hooks
You can change the injected sidebar object using the hooks parameter
| name | description | type | default |
|---|---|---|---|
| sideBarResolved | receive complete sidebar objects for custom modifications | (data: DefaultTheme.SidebarMulti) => DefaultTheme.SidebarMulti |
|
| sideBarItemsResolved | receive complete sidebar subItem objects for custom modifications | (data: DefaultTheme.SidebarItem[]) => DefaultTheme.SidebarItem[] |
|
| beforeCreateSideBarItems | obtain a list of file names scanned before generating sidebar subitems. If you want to sort sidebar data, it is recommended to use it | (data: string[]) => string[] |
License
MIT License © 2023 QC2168
QC2168