针对 HTML、Next.js App Router 和 Vite (React & Vue) 项目的全面 SEO 和社交元数据实施。在以下情况下使用：(1) 创建、编辑或审查元标记、Open Graph、Twitter 卡、规范/hreflang 链接、JSON-LD 结构化数据、主题颜色或 favicon/manifest 配置； (2) 使用 html/index.html、nextjs/metadata.ts、nextjs/dynamic-metadata-example.tsx、vite/index.html、vite/SEO.tsx 或 vite/SEO.vue； (3) 在新页面或路线中添加SEO； (4) 从react-helmet、vue-meta或next-seo迁移； (5) 生成内容驱动页面的动态元数据； (6) 审核元数据的完整性或最佳实践合规性。
通过命令行快速安装 seo-meta-tags AI 技能到你的开发环境
来源：jeremy0x/meta-tag-boilerplate。
Boilerplate and component library for production-ready metadata across three framework targets.
| HTML | Static sites, any backend, SSGs | references/html.md | | Next.js | Next.js 13+ App Router projects | references/nextjs.md | | Vite | Vite + React or Vite + Vue apps | references/vite.md |
Read only the reference file that matches the user's target framework.
针对 HTML、Next.js App Router 和 Vite (React & Vue) 项目的全面 SEO 和社交元数据实施。在以下情况下使用：(1) 创建、编辑或审查元标记、Open Graph、Twitter 卡、规范/hreflang 链接、JSON-LD 结构化数据、主题颜色或 favicon/manifest 配置； (2) 使用 html/index.html、nextjs/metadata.ts、nextjs/dynamic-metadata-example.tsx、vite/index.html、vite/SEO.tsx 或 vite/SEO.vue； (3) 在新页面或路线中添加SEO； (4) 从react-helmet、vue-meta或next-seo迁移； (5) 生成内容驱动页面的动态元数据； (6) 审核元数据的完整性或最佳实践合规性。 来源：jeremy0x/meta-tag-boilerplate。
为搜索与 AI 引用准备的稳定字段与命令。
npx skills add https://github.com/jeremy0x/meta-tag-boilerplate --skill seo-meta-tags针对 HTML、Next.js App Router 和 Vite (React & Vue) 项目的全面 SEO 和社交元数据实施。在以下情况下使用：(1) 创建、编辑或审查元标记、Open Graph、Twitter 卡、规范/hreflang 链接、JSON-LD 结构化数据、主题颜色或 favicon/manifest 配置； (2) 使用 html/index.html、nextjs/metadata.ts、nextjs/dynamic-metadata-example.tsx、vite/index.html、vite/SEO.tsx 或 vite/SEO.vue； (3) 在新页面或路线中添加SEO； (4) 从react-helmet、vue-meta或next-seo迁移； (5) 生成内容驱动页面的动态元数据； (6) 审核元数据的完整性或最佳实践合规性。 来源：jeremy0x/meta-tag-boilerplate。
打开你的终端或命令行工具（如 Terminal、iTerm、Windows Terminal 等） 复制并运行以下命令：npx skills add https://github.com/jeremy0x/meta-tag-boilerplate --skill seo-meta-tags 安装完成后，技能将自动配置到你的 AI 编程环境中，可以在 Claude Code、Cursor 或 OpenClaw 中使用
https://github.com/jeremy0x/meta-tag-boilerplate