Community图像github.com

模板品牌重塑

将Next.js App Router项目及其可选的NestJS API重新品牌化为新品牌(名称与文字标志、颜色、Logo与图标文件、各语言环境文案、元数据和SEO标题、邮件、种子数据),然后验证旧名称已完全移除且所有构建均通过。用于在要求为新的业务重命名、白标或重命名模板、启动器或应用时使用。

模板品牌重塑 是什么?

该技能用于系统地将Next.js(及可选的NestJS)项目重新品牌化为新品牌。它首先通过映射项目并记录初始构建状态来建立基线,然后按步骤处理:1)更新名称和文字标志(品牌配置文件、Logo组件等,但保留包名、环境变量等基础设施);2)替换品牌颜色(主题文件中的色调,并确保对比度符合无障碍标准);3)替换Logo和图标文件(保持文件命名与引用同步);4)重写所有语言环境的文案(不仅仅是查找替换,而是重新撰写本地化内容);5)更新元数据和SEO(页面布局、Open Graph、JSON-LD、站点地图等);6)更新邮件(发送方名称、主题、页眉页脚,发送地址保留为环境变量);7)更新种子数据和模拟数据(确保API与前端一致);8)执行最终构建验证(确保所有构建通过,CHECK工具输出PASS)。该技能在任何具有Node.js环境的项目中均可工作,通过专用的`rebrand-check.mjs`脚本在每个步骤后验证变更。它专为完整的品牌重塑或白标场景设计,可生成详细报告,列出更改的内容、未明确指定的选择以及需要人工处理的剩余事项(如域名、DNS、法律文本)。

兼容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/aniq-ui-pro/agent-skills/tree/HEAD/skills/template-rebrand

Installed? Explore more 图像 skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

重新品牌化 Next.js(和 NestJS)项目

按顺序逐步操作。每一步都以检查结束:运行它,修复发现的问题,然后才进入下一步。CHECK 指在项目根目录下运行以下命令:

node ${CLAUDE_SKILL_DIR}/scripts/rebrand-check.mjs check \
  --old "旧名称" --old "旧名称的其他写法" \
  --new "新名称" --new "新名称的其他写法"

当旧名称是常见单词(如 STORE)时添加 --case,对于有意保留旧名称的文件使用 --allow <path>。永远不要运行盲目的查找替换。

0. 简报、映射和基线

  1. 记录项目使用的所有形式的旧名称(每种语言、slug、电子邮件域名)以及每种语言的新名称、品牌颜色、Logo 文件和语气。如果请求遗漏了某项,选择一个合理的值,继续操作,并在报告中列出该选择。
  2. 运行 node ${CLAUDE_SKILL_DIR}/scripts/rebrand-check.mjs map。
  3. 在进行任何编辑之前,先运行一次映射中每个应用的构建命令。

检查:你已获得映射、需要减少的 CHECK 命中计数,以及每个构建的结果。已失败的构建将被记录为并非由品牌重塑引起。

1. 名称和文字标志

品牌配置文件、Logo 组件、Web 应用清单以及种子写入的任何设置行(发件人名称通常在其中)。除非明确要求,否则保留包名、环境变量名、数据库名、Docker 卷和存储前缀:重命名它们会破坏安装和现有数据。

检查:CHECK 在“品牌配置”下显示 0 个命中。你保留的基础设施命中将在报告中列出。

2. 颜色

映射列出的主题文件中的品牌标记,包括浅色和深色模式,加上清单或视口中的浏览器主题颜色。组件中不应写入任何颜色。

检查:使用 --old "#旧十六进制值" 针对每个旧品牌颜色运行 CHECK,显示 0 个命中,并且新颜色上的文本在两种主题下均保持 4.5:1 的对比度。

3. Logo 和图标文件

替换映射列出的文字标志、标记、favicon、应用图标和分享图片。保持文件名和大小,或更新所有引用。打开每个新文件并检查它。

检查:CHECK 报告 public/ 中没有缺失的图片路径,并且没有包含旧名称的文件或文件夹名称,除非你有意保留。

4. 所有语言环境的文案

重写,而不仅仅是重命名:首页、关于、页脚、法律信息、支持、SEO,以及任何描述旧业务的句子。每个语言环境中的键相同,每种语言以本地语言书写。

检查:CHECK 在“消息”下显示 0 个命中,并且没有语言环境或消息文件在一种语言中有新名称而另一种语言中没有。

5. 元数据和 SEO

根布局和页面布局、generateMetadata、标题模板、Open Graph 和 Twitter 字段、JSON-LD、站点地图、robots.txt、清单中的 name 和 short_name。

检查:CHECK 在“元数据和 SEO”下显示 0 个命中。

6. 电子邮件

发件人名称、主题、页眉和页脚、链接,以及 API 发送的每种语言。发件人地址和域名来自环境变量:在报告中列出它们。

检查:CHECK 在“电子邮件”下显示 0 个命中。

7. 种子数据和模拟数据

种子程序、固件和模拟目录:产品、类别、设置行、演示账户电子邮件域名、图片路径。API 种子和任何前端模拟数据一致。

检查:CHECK 在“种子数据”下显示 0 个命中。

8. 构建和最终检查

重新运行每个应用的构建命令。修复错误直到每个命令都通过。除非被要求,否则不要启动开发或生产服务器。

检查:每个构建均以退出码 0 结束,然后 CHECK 输出 Result: PASS。

报告

每个步骤更改的文件、对简报中遗漏的内容所做的选择、每个允许的命中及其原因、构建结果,以及留给人工处理的内容:域名、DNS、电子邮件发件人、法律文本。

相关技能