搜索

Sveltepress 默认主题支持三种方式为站点添加搜索功能：

  • Algolia DocSearch — 通过内置的 docsearch 选项
  • Meilisearch — 通过 @sveltepress/meilisearch 和 search 选项
  • 自定义搜索 — 将任意 Svelte 组件或模块路径字符串传给 search 选项

Algolia DocSearch

向 defaultTheme 传入 docsearch 配置对象，即可在导航栏启用 Algolia DocSearch 。

必填字段为 appId、apiKey 和 indexName，同时也支持所有其他 DocSearch 选项 。

vite.config.(js|ts)
import {  } from '@sveltepress/theme-default'
import {  } from '@sveltepress/vite'
import {  } from 'vite'

export default ({
  : [
    ({
      : ({
        : {
          : 'YOUR_APP_ID',
          : 'YOUR_SEARCH_API_KEY',
          : 'YOUR_INDEX_NAME',
        },
      }),
    }),
  ],
})
ts
申请 DocSearch

DocSearch 对开源文档站点免费开放。在 docsearch.algolia.com 提交申请。

Meilisearch

Meilisearch 是一款开源的自托管搜索引擎。结合 @sveltepress/meilisearch 包和 search 选项，即可将其集成到站点中。

安装

npm install --save @sveltepress/meilisearch
sh

配置

将 @sveltepress/meilisearch 导出的 Search.svelte 组件路径传给 search 选项：

vite.config.(js|ts)
import {  } from '@sveltepress/theme-default'
import {  } from '@sveltepress/vite'
import {  } from 'vite'

export default ({
  : [
    ({
      : ({
        : '@sveltepress/meilisearch/Search.svelte',
      }),
    }),
  ],
})
ts

Search.svelte 组件接受以下 props。你可以通过创建一个包装组件来传入这些 props。

属性类型必填说明
hoststring✅Meilisearch 实例的 URL
apiKeystring✅仅搜索用的 API key
indexNamestring✅需要搜索的索引名称
placeholderstring—搜索输入框的占位文字（默认：'Search...'）
limitnumber—最多展示的结果数量（默认：10）
自托管 vs Meilisearch Cloud

你可以自行托管 Meilisearch，也可以使用 Meilisearch Cloud 。host 指向你所选择的部署地址即可。

自定义搜索

search 选项同样可以直接接受 Svelte Component，让你自由接入任何搜索库：

vite.config.(js|ts)
import {  } from '@sveltepress/theme-default'
import {  } from '@sveltepress/vite'
import {  } from 'vite'
import  from './src/components/MySearchComponent.svelte'

export default ({
  : [
    ({
      : ({
        : ,
      }),
    }),
  ],
})
ts
search 与 docsearch 的优先级

当 search 和 docsearch 同时配置时，search 优先，docsearch 将被忽略。

在 Github 上编辑此页
最后更新于： 2026/03/09 12:36:50