diff --git a/docs/.vuepress/notes.ts b/docs/.vuepress/notes.ts
index b0e17600..7438bdc8 100644
--- a/docs/.vuepress/notes.ts
+++ b/docs/.vuepress/notes.ts
@@ -22,31 +22,36 @@ export const zhNotes = definePlumeNotesConfig({
{
text: 'markdown',
icon: 'material-symbols:markdown-outline',
- dir: 'markdown',
+ prefix: 'markdown',
+ collapsed: true,
items: ['基础', '扩展', '进阶'],
},
{
text: '代码块',
- dir: '代码',
+ prefix: '代码',
icon: 'ph:code-bold',
+ collapsed: true,
items: ['介绍', '特性支持', '代码组', '导入代码', 'twoslash'],
},
{
text: '代码演示',
- dir: '代码演示',
+ prefix: '代码演示',
icon: 'carbon:demo',
+ collapsed: true,
items: ['前端', 'rust', 'golang', 'kotlin', 'codepen', 'jsFiddle', 'codeSandbox', 'replit'],
},
{
text: '图表',
icon: 'mdi:chart-line',
- dir: '图表',
+ prefix: '图表',
+ collapsed: true,
items: ['chart', 'echarts', 'mermaid', 'flowchart'],
},
{
text: '资源嵌入',
icon: 'dashicons:embed-video',
- dir: '嵌入',
+ prefix: '嵌入',
+ collapsed: true,
items: ['pdf', 'bilibili', 'youtube'],
},
],
@@ -55,8 +60,13 @@ export const zhNotes = definePlumeNotesConfig({
text: '功能',
icon: 'lucide:box',
collapsed: false,
- dir: '功能',
- items: ['图标', '代码复制', '内容搜索', '评论', '加密', '组件', '文章水印', '友情链接页', 'seo', 'sitemap'],
+ prefix: '功能',
+ items: ['图标', '代码复制', '内容搜索', '评论', '加密', '组件', '文章水印', '友情链接页', 'seo', 'sitemap', {
+ text: '非内置功能',
+ icon: 'system-uicons:box-add',
+ collapsed: false,
+ items: ['repoCard', 'npmBadge'],
+ }],
},
{
text: '自定义',
@@ -89,13 +99,13 @@ export const zhNotes = definePlumeNotesConfig({
},
{
text: 'frontmatter',
- dir: 'frontmatter',
+ prefix: 'frontmatter',
collapsed: false,
items: ['basic', 'home', 'post', 'friend'],
},
{
text: '内置插件',
- dir: 'plugins',
+ prefix: 'plugins',
collapsed: false,
items: ['', '代码高亮', '搜索', '阅读统计', 'markdown增强', 'markdownPower', '百度统计', '水印'],
},
@@ -109,7 +119,7 @@ export const zhNotes = definePlumeNotesConfig({
text: '插件',
items: [
// 'caniuse',
- 'iconify',
+ // 'iconify',
'shiki',
'md-power',
'content-updated',
diff --git a/docs/notes/theme/config/主题配置.md b/docs/notes/theme/config/主题配置.md
index 7a14c0d3..68a66509 100644
--- a/docs/notes/theme/config/主题配置.md
+++ b/docs/notes/theme/config/主题配置.md
@@ -179,6 +179,8 @@ interface BlogOptions {
::: warning
该字段不支持在 [主题配置文件 `plume.config.js`](./配置说明.md#主题配置文件) 中进行配置。
+
+ 为了使缓存能够生效,您应该 **删除** `package.json` 中 `vuepress dev` 开发服务启动脚本中的 `--clean-cache` 参数。
:::
### locales
diff --git a/docs/notes/theme/guide/功能/npmBadge.md b/docs/notes/theme/guide/功能/npmBadge.md
new file mode 100644
index 00000000..e3640aae
--- /dev/null
+++ b/docs/notes/theme/guide/功能/npmBadge.md
@@ -0,0 +1,151 @@
+---
+title: Npm 徽章
+author: pengzhanbo
+icon: akar-icons:npm-fill
+createTime: 2024/07/26 22:07:23
+permalink: /guide/npm-badge/
+---
+
+
+
+## 概述
+
+Npm 徽章组件 用于显示 npm 包信息,并提供相关的链接。
+
+徽章由 提供支持。
+
+## 使用
+
+使用该组件需要你手动导入 `NpmBadge` 或 `NpmBadgeGroup` 组件:
+
+```md :no-line-numbers
+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+## ``
+
+单个 npm badge
+
+### Props
+
+| 名称 | 类型 | 必填 | 默认值 | 说明 |
+| ---------- | --------------- | --------------- | ----------- | --------------------------------------- |
+| name | `string` | 否 | `''` | npm 包名,为空则从 `repo` 中获取 |
+| repo | `string` | name 为空时必填 | `''` | 包 github 仓库地址, 格式为 `owner/repo` |
+| type | `NpmBadgeType` | 是 | - | 徽章类型 |
+| theme | `NpmBadgeTheme` | 否 | `'flat'` | 徽章主题 |
+| label | `string` | 否 | `''` | 徽章标签 |
+| color | `string` | 否 | `'#32A9C3'` | 徽章颜色 |
+| labelColor | `string` | 否 | `'#1B3C4A'` | 徽章标签颜色 |
+| branch | `string` | 否 | `'main'` | 仓库分支 |
+| dir | `string` | 否 | `''` | 包所在仓库目录,适用于 monorepo 项目 |
+
+### Types
+
+```ts
+type NpmBadgeType =
+ // github
+ | 'source' // github source
+ | 'stars' // github stars
+ | 'forks' // github forks
+ | 'license' // github license
+ // npm
+ | 'version' // npm version
+ | 'dt' // alias d18m
+ | 'd18m' // npm downloads last 18 months
+ | 'dw' // npm downloads weekly
+ | 'dm' // npm downloads monthly
+ | 'dy' // npm downloads yearly
+
+type NpmBadgeTheme = 'flat' | 'flat-square' | 'plastic' | 'for-the-badge' | 'social'
+```
+
+### 示例
+
+- `` -
+- `` -
+- `` -
+- `` -
+- `` -
+- `` -
+- `` -
+- `` -
+- `` -
+- `` -
+
+## ``
+
+组合多个 npm badge
+
+### Props
+
+| 名称 | 类型 | 必填 | 默认值 | 说明 |
+| ---------- | --------------- | --------------- | ------ | --------------------------------------- |
+| name | `string` | 否 | `''` | npm 包名,为空则从 `repo` 中获取 |
+| repo | `string` | name 为空时必填 | `''` | 包 github 仓库地址, 格式为 `owner/repo` |
+| items | `string \| NpmBadgeType[]` | 否 | - | 徽章类型列表, 传入 `string` 时用 `','`分隔,会自动转换为 `NpmBadgeType[]` |
+| theme | `NpmBadgeTheme` | 否 | `''` | 徽章主题 |
+| color | `string` | 否 | `''` | 徽章颜色 |
+| labelColor | `string` | 否 | `''` | 徽章标签颜色 |
+| branch | `string` | 否 | `''` | 仓库分支 |
+| dir | `string` | 否 | `''` | 包所在仓库目录,适用于 monorepo 项目 |
+
+### Slots
+
+`` 支持传入 多个 `` 组件。
+
+`` 声明的 `Props` 将被注入到 `` 组件中。通过这种方式来实现和简化徽章组合。
+
+### 示例
+
+**输入:**
+
+```md :no-line-numbers
+
+```
+
+**输出:**
+
+
+
+使用 `` 灵活定义徽章组合:
+
+**输入:**
+
+```md :no-line-numbers
+
+
+
+
+
+
+```
+
+**输出:**
+
+
+
+
+
+
+
diff --git a/docs/notes/theme/guide/功能/repoCard.md b/docs/notes/theme/guide/功能/repoCard.md
new file mode 100644
index 00000000..60535f6d
--- /dev/null
+++ b/docs/notes/theme/guide/功能/repoCard.md
@@ -0,0 +1,91 @@
+---
+title: Repo 卡片
+author: pengzhanbo
+icon: octicon:repo-16
+createTime: 2024/07/26 21:11:56
+permalink: /guide/github-repo-card/
+---
+
+
+
+## 概述
+
+Repo 卡片组件 用于显示 GitHub 仓库信息。
+
+## 使用
+
+使用该组件需要你手动导入 `RepoCard` 组件:
+
+```md :no-line-numbers
+
+
+
+
+
+```
+
+注册为全局组件:
+
+::: code-tabs
+@tab .vuepress/client.ts
+
+```ts
+import { defineClientConfig } from 'vuepress/client'
+import RepoCard from 'vuepress-theme-plume/features/RepoCard.vue'
+
+export default defineClientConfig({
+ enhance({ app }) {
+ app.component('RepoCard', RepoCard)
+ },
+})
+```
+
+:::
+
+全局组件可在 其他任意 markdown 文件中使用
+
+```md
+
+```
+
+### Props
+
+`RepoCard` 组件的 接收一个 `repo` 参数,传入的是仓库的地址,格式为 `owner/repo`。
+
+## 示例
+
+### 单卡片
+
+**输入:**
+
+```md
+
+```
+
+**输出:**
+
+
+
+### 多卡片
+
+如果希望以紧凑的方式并排展示多个卡片,可以使用 `CardGrid` 组件。
+
+**输入:**
+
+```md
+
+
+
+
+```
+
+**输出:**
+
+
+
+
+