此页内容

约 254 字小于 1 分钟

2023-02-26

npm versionnpm total downloadsnpm yearly downloadsgithub source

指南

根据配置,读取 vuepress 应用下的 markdown 文件,将符合规则的 page 归类为 notes , 简化配置 sidebar。 并提供 useNotesData方法获取 notes 数据,提供给 vuepress 主题的开发者。

插件不提供组件,仅提供相关的数据,主题开发者可通过数据开发自定义的 notes 功能。

安装

yarn
yarn add @vuepress-plume/plugin-notes-data

使用

// .vuepress/config.ts
import notesDataPlugin from '@vuepress-plume/plugin-notes-data'
module.exports = {
  //...
  plugins: [
    notesDataPlugin({
      dir: '/notes/'
    })
  ]
  // ...
}

Options

type NotesDataOptions = {
  dir: string
  link: string
  include?: string | string[]
  exclude?: string | string[]
  notes: NotesItem[]
}

type NotesItem = {
  dir: string
  link: string
  text: string
  sidebar?: NotesSidebar | 'auto'
}

type NotesSidebar = (NotesSidebarItem | string)[]

type NotesSidebarItem = {
  text?: string
  link?: string
  dir?: string
  collapsed?: boolean
  items?: NotesSidebar
}

useNotesData()

在 client 端,获取 notes sidebar data

<script lang="ts" setup>
import { useNotesData } from '@vuepress-plume/plugin-notes-data/client'
const notesData = useNotesData()
</script>