1.0.9 • Published 2 years ago

vuepress-plugin-auto-sidebar-navbar v1.0.9

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

vuepress-plugin-auto-sidebar-navbar

介绍(Introduction)

这是为 vuepress v2 自动生成侧边栏和导航栏的插件。 插件支持功能如下:

  1. 自动生成sidebar和navbar。
  2. 根据文件内容自动排序。
  3. 支持自定义排序方法。

安装(Install)

## vuepress v2
npm i vuepress-plugin-auto-sidebar-navbar -D

快速使用(Usage)

VuePress v2 不再支持插件修改 sidebar,所以你需要在.vuepress/config.js自行引入生成的 sidebar.jsnavbar.js文件。

const { defaultTheme } = require('@vuepress/theme-default')
const navbar = require('./navbar.js')
const sidebar = require('./sidebar.js')
module.exports = {
  plugins: [
    ...,
    require('vuepress-plugin-auto-sidebar-navbar')({})
  ],
  theme: defaultTheme({
    ...,
    navbar, 
    sidebar, 
  })
}

插件默认参数

传参方式为:require('vuepress-plugin-auto-sidebar-navbar')(options),其中options默认为以下参数:

options = {
    skipSidebar: false, // 默认生成sidebar
    skipNavbar: false, // 默认生成navbar
    sidebarUrl: '.vuepress/sidebar.js', // sidebar路径
    navbarUrl: '.vuepress/navbar.js', // navbar路径
}

自动排序

  1. sidebar(侧边栏)根据md文件内容排序,排序规则为:autoSort: {number}中的number从小到大排序,其中number默认为 0。
  2. navbar(导航栏)根据目录中的README.md文件内容排序,排序规则为:autoNavSort: {number}中的number从小到大排序,其中number默认为 0。

sidebar为例,a.md内容如下:

---
autoSort: -1
---
# 文件a

b.md内容如下:

# 文件b

sidebar显示内容:

文件a
文件b

自定义规则排序

.vuepress/config.js中传入参数sortFn:

module.exports = {
  ...,
  plugins: [
    ...,
  	require('vuepress-plugin-auto-sidebar-navbar')({
  	sortFn: (a, b) => {
  		if (a.sort !== b.sort) return a.sort < b.sort ? -1 : 1
        	if (a.name !== b.name) return a.name < b.name ? -1 : 1
        	else if (a.createTime !== b.createTime) return a.createTime < b.createTime ? -1 : 1
        	else if (a.updateTime !== b.updateTime) return a.updateTime < b.updateTime ? -1 : 1
		},
	})
  ],
}
1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.2

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago