HeadstartWP 无头框架
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @user_3c6cb52e/headstartwp-headless-wordpress-nextjs-framework。
技能介绍
解决什么问题
把 WordPress 从「主题渲染一切」切换到无头架构时,团队很快就要面对一堆重复劳动:JWT 鉴权、路由映射、草稿预览、REST/GraphQL 取数、SEO 标签注入、多语言站点交付。每个项目都要重新拼装一遍,而这些方案往往散落在各个博客和 issue 里。HeadstartWP 把这些模式固化成一套开源框架,让 Next.js 前端可以直接对接 WordPress 后端。
它是怎么工作的
框架由三部分组成:一个 WordPress 插件、一组 JavaScript 包,以及一套有文档记录的实现模式。
- 路由:把 WordPress 的固定链接映射到 Next.js 路由,保持 URL 结构一致。
- 预览:支持在发布前查看草稿和待审核内容,不用先提交才能看到效果。
- 内容获取:提供统一的取数路径,前端组件不必自己拼请求。
- SEO 与多语言:覆盖 meta 输出和跨语言内容交付的常见写法。
关键步骤是先理解这套模式在仓库 docs 目录里的说明,再据此搭建或扩展现有前端。
适用边界与注意点
- 文档站点位于
docs目录,但它并不属于 monorepo/workspace 配置的一部分,需要在docs目录内单独执行依赖安装。 - 本技能摘自上游 README,属于资料汇总性质,具体 API 和用法应以 HeadstartWP 上游仓库的说明为准。
- 适合需要自定义前端、又希望保留 WordPress 内容管理能力的项目;如果只是搭一个普通博客,传统主题可能更省事。
使用场景
- 把 WordPress 站点改成无头架构时,需要配置 Next.js 路由与 WordPress 固定链接的映射关系。
- 内容编辑提交文章后,前端要能预览草稿和待审核内容,确认排版无误再发布。
- 搭建多语言站点时,需要让前端按语言环境获取对应内容并输出对应的 SEO 标签。
- 接手现有项目,在 Next.js 前端里扩展内容获取逻辑,对接 WordPress 后端的取数接口。
适合人员
- 负责把传统 WordPress 主题改造成 Next.js 前端的前端工程师,需要现成的路由与取数模式。
- 维护品牌官网的技术负责人,想在保留 WordPress 内容管理的同时换成自定义前端。
- 为国际访客做多语言版本的开发者,需要框架内的多语言交付与 SEO 方案。
- 刚接手无头 WordPress 项目、想按文档快速搭起预览与取数流程的工程师。