本地搜索(@vuepress/plugin-slimsearch替换vuepress-plugin-search-pro)
要实现全局搜索标签（Tag），你需要使用slimsearch插件的customFields配置项。这个功能允许你将页面中的自定义数据（比如标签、分类、作者等）添加到搜索索引中。
{"@vuepress/plugin-slimsearch":"2.0.0-rc.121"}🏷️ 全局搜索Tag的配置方案
基础配置：搜索文章标签
假设你在文章的 Frontmatter 中是这样定义标签的：
--- title: 我的文章 tags: - Vue.js - 前端开发 - JavaScript ---在.vuepress/config.ts中添加如下配置：
import{slimsearchPlugin}from'@vuepress/plugin-slimsearch'exportdefault{plugins:[slimsearchPlugin({// 确保启用了内容索引（如果需要同时搜索正文）indexContent:true,// 自定义字段：添加标签搜索customFields:[{name:'tags',getter:(page)=>page.frontmatter.tags,formatter:'标签: $content',},],}),],}处理不同格式的Tag
标签可能有不同的格式，你可以通过getter函数灵活处理：
customFields:[{name:'tags',getter:(page)=>{consttags=page.frontmatter.tags// 处理字符串格式： "Vue,React"if(typeoftags==='string'){returntags.split(',').map(tag=>tag.trim())}// 处理数组格式： ["Vue", "React"]if(Array.isArray(tags)){returntags}// 处理单个标签： "Vue"if(typeoftags==='string'){return[tags]}returnnull},formatter:'标签: $content',},]多语言支持
如果你的站点有多语言，可以为不同语言设置不同的显示格式：
customFields:[{name:'tags',getter:(page)=>page.frontmatter.tags,formatter:{'/':'Tags: $content','/zh/':'标签: $content','/jp/':'タグ: $content',},},]同时搜索多个字段
如果你想同时搜索标签、分类和作者：
customFields:[{name:'tags',getter:(page)=>page.frontmatter.tags,formatter:'🏷️ $content',},{name:'category',getter:(page)=>page.frontmatter.category,formatter:'📁 $content',},{name:'author',getter:(page)=>page.frontmatter.author,formatter:'👤 $content',},]🔧 注意事项
1. 确保索引生效
- 添加
customFields后，需要删除.vuepress/.temp和.vuepress/dist并重新构建 - 如果搜索不到，检查 Frontmatter 中是否有
search: false禁用索引
2. 调试技巧
在浏览器控制台查看索引是否包含标签数据：
// 查看搜索插件的内部状态window.__VUEPRESS__?.__plugins?.slimsearch?.index3. 版本兼容性
- 确保
@vuepress/plugin-slimsearch的版本与你的 VuePress 核心版本兼容 - 如果使用
vuepress-theme-hope，建议通过主题的plugins.slimsearch配置，避免重复引入
4. 搜索效果
配置完成后，当你搜索"Vue.js"时，搜索结果中会出现：
- 标题包含"Vue.js"的文章
- 正文包含"Vue.js"的文章（如果开启
indexContent） - 标签包含"Vue.js"的文章（会显示为"标签: Vue.js"）