Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/QC2168/vite-plugin-vitepress-auto-sidebar
The vite plugin that automatically generates sidebar data by scanning directories, based on vitepress
https://github.com/QC2168/vite-plugin-vitepress-auto-sidebar
Last synced: 3 months ago
JSON representation
The vite plugin that automatically generates sidebar data by scanning directories, based on vitepress
- Host: GitHub
- URL: https://github.com/QC2168/vite-plugin-vitepress-auto-sidebar
- Owner: QC2168
- License: mit
- Created: 2023-01-20T06:42:44.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-01T04:41:39.000Z (5 months ago)
- Last Synced: 2024-10-23T02:39:40.816Z (3 months ago)
- Language: TypeScript
- Size: 322 KB
- Stars: 97
- Watchers: 1
- Forks: 12
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-vitepress-v1 - vite-plugin-vitepress-auto-sidebar - Automatically generates sidebar data by scanning directories (:electric_plug: Plugins / Community Plugins)
- fucking-awesome-vite - vite-plugin-vitepress-auto-sidebar - Automatically generates sidebar data by scanning directories, based on vitepress. (Plugins / Framework-agnostic Plugins)
- awesome-vite - vite-plugin-vitepress-auto-sidebar - Automatically generates sidebar data by scanning directories, based on vitepress. (Plugins / Framework-agnostic Plugins)
README
# vite-plugin-vitepress-auto-sidebar
The vite plugin that automatically generates sidebar data by scanning directories, based on vitepress
[](http://blog.csdn.net/a_zhon)
[](http://blog.csdn.net/a_zhon)
[](http://blog.csdn.net/a_zhon)
## ✨ 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
```bash
# 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`
```typescript
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
| name | description | type | default |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------ | ------- |
| ignoreList | ignore specified folder | `string[]` | `true` |
| path | create scan path for the sidebar | `string` | `/docs` |
| 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` | |
| 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[]` | |
| titleFromFile | read title from md file | `boolean` | `false` |
| titleFromFileByYaml | read title from yaml config | `boolean` | `false` |
## License
[MIT](./LICENSE) License © 2023 [QC2168](https://github.com/QC2168)