安装与运行
Pagefind 支持 Windows、macOS 和 Linux。对于 Node.js 项目,最常见的方式是通过 npm 包运行。
使用 npx 快速运行
假设静态站点已经输出到 public/:
npx -y pagefind --site public --serve
其中:
--site public指向已经构建好的静态站点目录。--serve会在生成索引后启动本地预览,方便验证搜索效果。
正式部署时通常去掉 --serve:
npx -y pagefind --site public
在项目中固定版本
生产项目建议把 Pagefind 放入依赖,让 CI 和本地构建使用同一版本:
pnpm add -D pagefind
然后在构建脚本里追加索引步骤:
{
"scripts": {
"build": "vite build && pagefind --site dist"
}
}
如果使用 pnpm,也可以显式通过 pnpm exec 调用:
pnpm exec pagefind --site dist --output-path dist/_pagefind
Python 与二进制方式
Python 项目可以安装扩展版本:
python3 -m pip install 'pagefind[extended]'
python3 -m pagefind --site public
也可以从 GitHub Release 下载预编译二进制文件:
./pagefind --site public
./pagefind_extended --site public
扩展版本包含对中文、日文等特殊语言的更好分词支持。面向中文站点时,优先使用 npm 包、pagefind[extended] 或 pagefind_extended。
构建顺序
Pagefind 必须在静态页面生成之后运行:
1. 生成 HTML
2. 复制静态资源
3. 运行 pagefind
4. 部署最终输出目录
如果在开发服务器启动时直接访问源码页面,通常看不到搜索结果,因为 Pagefind 还没有扫描最终 HTML。
相关内容
- Pagefind 是什么 介绍 Pagefind 的定位、工作流程、适用场景与限制,帮助你判断它是否适合文档站、博客和静态内容网站。
- 索引范围控制 讲解 data-pagefind-body、data-pagefind-ignore、root selector、include characters 等索引控...
- 搜索 UI 介绍 Pagefind Component UI 的引入方式、弹窗搜索、搜索框组件和样式定制思路,适合快速给静态站点增加搜索入口。
- JavaScript API 讲解如何通过 /_pagefind/pagefind.js 动态导入搜索 API,执行查询、按需加载结果、渲染标题、摘要和 URL。
- 元数据与筛选 介绍 data-pagefind-meta、data-pagefind-filter、默认元数据、属性捕获和筛选查询设计,让搜索结果更有结构。
- 中文搜索配置 讲解 Pagefind 在中文站点中的语言识别、extended 版本、force language、中文分词特点和技术文档搜索建议。