企业官网建设流程全解析

awesome-gpt-image-2 本地开发指南：Node.js+Payload CMS环境搭建、脚本调试与常见问题排查

【免费下载链接】awesome-gpt-image-2🚀 World's largest GPT Image 2 prompt library, updated daily — 2000+ curated prompts with preview images, 16 languages. OpenAI's next-gen image model with pixel-perfect text rendering, cross-image consistency, and commercial-grade illustration. Free & open source.项目地址: https://gitcode.com/gh_mirrors/aw/awesome-gpt-image-2

awesome-gpt-image-2是全球最大的 GPT Image 2 提示词库，收录 2000+ 精选提示词并支持 16 种语言。本指南带你从零完成awesome-gpt-image-2 本地开发环境搭建：基于Node.js 20 + pnpm + Payload CMS一键安装依赖、配置.env环境变量、运行generate与sync两大核心脚本，并排查 401 认证失败等常见问题，全程无需任何前置经验。

1. 开发环境概览：项目结构与前置要求 🧭

在动手之前，先了解这个项目的"骨架"。它是一个轻量级的TypeScript 脚本工具集，不包含前端页面，核心价值是连接 Payload CMS 与仓库文档的自动化脚本：

. ├── .env.example # 环境变量模板（复制为 .env 使用） ├── package.json # 依赖与脚本定义 ├── tsconfig.json # TypeScript 编译配置（ES2022 模块） ├── scripts/ │ ├── generate-readme.ts # 核心脚本①：拉取提示词并生成 16 个语言的 README │ ├── sync-approved-to-cms.ts # 核心脚本②：把已审核的 Issue 同步到 CMS │ └── utils/ │ ├── cms-client.ts # Payload CMS API 客户端（增删改查提示词） │ ├── markdown-generator.ts # Markdown 生成器 + 16 语言配置 │ ├── image-uploader.ts # 图片上传模块 │ └── i18n.ts # 多语言文案 └── README*.md # 自动生成的 16 个语言版本（请勿手动编辑）

前置要求（缺一不可）📋

💡 版本验证：node -v应输出v20.x，pnpm -v应输出9.x。版本过低会导致dotenv、tsx等依赖运行异常。

2. 一键安装步骤：依赖安装与环境变量配置 ⚙️

2.1 克隆仓库并安装依赖

git clone https://gitcode.com/gh_mirrors/aw/awesome-gpt-image-2 cd awesome-gpt-image-2 pnpm install # 或 npm install

依赖非常精简：tsx（直接运行 TypeScript）、dotenv（加载环境变量）、@octokit/rest（GitHub API）、node-fetch与qs-esm（CMS 请求）。

2.2 配置 .env 环境变量

仓库内置了 ​.env.example 模板，复制后填入真实凭证即可：

cp .env.example .env

编辑.env，必填项只有两个（对应 docs/LOCAL_DEVELOPMENT.md 中的说明）：

# 所有脚本必需：Payload CMS 配置 CMS_HOST=https://your-cms-host.com CMS_API_KEY=your-api-key-here # 可选：仅测试 sync 脚本时需要 GITHUB_TOKEN=ghp_your_personal_access_token GITHUB_REPOSITORY=YouMind-OpenLab/awesome-gpt-image-2 ISSUE_NUMBER=123

⚠️三个高频踩坑点：

1. CMS_HOST末尾不要带斜杠（https://cms.com✅，https://cms.com/❌），否则会拼接出双斜杠导致请求失败；
2. .env已在 .gitignore 中，严禁提交到仓库，凭证只放在本地；
3. 两个脚本都通过import "dotenv/config"在代码执行前自动加载.env，无需手动 source。

3. 核心脚本运行与调试：generate 与 sync 🔧

项目只有两条 npm 脚本，定义在 package.json 中：

3.1 测试 README 生成（最常用）

pnpm run generate

执行流程（由 scripts/generate-readme.ts 驱动）：

1. 遍历 scripts/utils/markdown-generator.ts 中定义的 16 种语言；
2. 通过 scripts/utils/cms-client.ts 依次拉取该语言的分类与提示词（精选 + 按 use-cases 类目）；
3. 排序去重后渲染 Markdown，覆盖写入对应的README.md、README_zh.md等 16 个文件；
4. 控制台逐语言打印✅ xxx.md updated successfully!，末尾输出✨ All languages processed successfully!即代表成功。

3.2 测试 Issue 同步（可选）

sync脚本用于验证"审核通过 → 自动入库"链路。前提是.env配齐GITHUB_TOKEN、GITHUB_REPOSITORY、ISSUE_NUMBER和ISSUE_BODY，然后：

pnpm run sync

脚本会按顺序：校验 Issue 的prompt-submission标签 → 解析表单字段 → 调用 scripts/utils/image-uploader.ts 上传图片到 CMS/api/media→ 新建或更新 prompt 文档 → 关闭 Issue。控制台会打印📝 Parsed fields:字段清单，是排查字段映射问题的最佳观察点。

调试小技巧：

• 单条命令覆盖变量：CMS_HOST=http://localhost:3000 pnpm run generate可临时指向本地 CMS，不影响.env；
• 优先级规则：系统环境变量 >.env文件 > 代码默认值，调试时可用前者临时"压"过.env；
• 直接在 VSCode 中调试入口文件即可断点，tsx会逐语言输出进度，卡在哪一行一目了然。

4. 常见问题排查（FAQ）🩺

排查口诀：先看控制台 emoji 进度（📥 拉取 → 🔃 排序 → 📝 生成）定位卡点，再看.env凭证，最后看网络。

5. 安全与本地工作流建议 🔐

• 凭证隔离：本地开发建议申请独立的测试 API Key，与线上生产 Key 分开使用；
• 多环境切换：本地可用CMS_HOST=http://localhost:3000指向自托管 Payload 实例，改完.env重新跑脚本即可，无需重启任何服务；
• 用假数据测试：在 CMS 中手动创建一条测试 prompt 并标记为 featured，跑一次generate即可验证全链路输出；
• 生产环境：仓库通过 GitHub Actions（.github/workflows/update-readme.yml）每天 08:00 / 20:00（北京时间）自动运行generate并提交 README，本地只需关注脚本行为是否与 CI 一致。

一句话总结：pnpm install→ 配好.env两个必填项 →pnpm run generate，三步即可在本地完整跑通 awesome-gpt-image-2 的核心链路。遇到 401 查 Key，遇到缺变量查.env，脚本卡点看控制台进度，祝你开发顺利 🚀

【免费下载链接】awesome-gpt-image-2🚀 World's largest GPT Image 2 prompt library, updated daily — 2000+ curated prompts with preview images, 16 languages. OpenAI's next-gen image model with pixel-perfect text rendering, cross-image consistency, and commercial-grade illustration. Free & open source.项目地址: https://gitcode.com/gh_mirrors/aw/awesome-gpt-image-2