How to Regenerate the Site Data for awesome-gpt-image-2: Complete Guide
Run npm run generate:site-data to rebuild the case catalog from Markdown source files into the JSON payload consumed by the Vite frontend.
The awesome-gpt-image-2 repository powers a searchable gallery of GPT-Image-2 prompts and examples. Its dynamic data layer is not hand-maintained but generated programmatically from structured Markdown files. Understanding how to regenerate this site data is essential when adding new cases, updating existing entries, or deploying fresh builds.
What the Generation Script Does
The Node.js script at scripts/generate-site-data.mjs transforms raw documentation into structured data. According to the source code, the script performs four core operations:
- Collects source files – reads
docs/gallery-part-1.mdanddocs/gallery-part-2.mdas input sources - Parses each case – extracts titles, prompts, image URLs, source links, and infers categories and tags using helper functions like
extractPrompt(),extractSource(),inferCategory(), andinferTags() - Builds a payload – aggregates overall statistics (
totalCases,categories,styles,scenes) plus an array of case objects with complete metadata - Writes JSON output – serializes the payload to
data/cases.json, creating the directory if necessary
The resulting data/cases.json is consumed by src/main.jsx to render the interactive gallery, filters, and case detail views.
Quick Regeneration Steps
Follow these commands to regenerate the site data from scratch:
# 1. Clone the repository
git clone https://github.com/freestylefly/awesome-gpt-image-2.git
cd awesome-gpt-image-2
# 2. Install dependencies
npm install
# 3. Regenerate site data for awesome-gpt-image-2
npm run generate:site-data
This single command executes node scripts/generate-site-data.mjs as declared in package.json lines 6–9.
Alternative: Direct Node Execution
Bypass npm scripts by invoking Node directly:
node scripts/generate-site-data.mjs
Both approaches produce identical output at data/cases.json.
Automating Full Regeneration
The repository includes npm lifecycle hooks that streamline workflows. The predev and prebuild hooks automatically trigger both generation scripts before starting the development server or creating a production build (see package.json lines 13–16).
For manual full regeneration including the Agent skill library:
# Regenerate site data
npm run generate:site-data
# Regenerate style-skill data (optional)
npm run generate:style-skill
# Start development server with fresh data
npm run dev
Key Files and Their Roles
| File | Purpose |
|---|---|
scripts/generate-site-data.mjs |
Core generator script that parses Markdown and outputs JSON |
package.json |
Declares generate:site-data and generate:style-skill npm scripts |
data/cases.json |
Generated output consumed by the Vite frontend |
docs/gallery-part-1.md, docs/gallery-part-2.md |
Source Markdown files containing case definitions |
scripts/generate-style-skill.mjs |
Companion generator for Agent skill data |
Regenerating After Content Changes
When you modify case data in the docs/ directory, the site frontend does not automatically detect changes. You must explicitly regenerate the site data for awesome-gpt-image-2 to reflect updates:
- Edit
docs/gallery-part-1.mdordocs/gallery-part-2.md - Run
npm run generate:site-data - Restart
npm run devor rebuild withnpm run build
The generation script re-parses all cases from scratch on every run, ensuring consistency across the entire catalog.
Summary
- Primary command:
npm run generate:site-dataexecutes the generation pipeline - Input sources: Markdown files in
docs/directory - Output target:
data/cases.jsonconsumed bysrc/main.jsx - Automation:
predevandprebuildhooks auto-regenerate when runningnpm run devornpm run build - Direct execution:
node scripts/generate-site-data.mjsworks identically
Frequently Asked Questions
What Node version is required to run the generation script?
The repository expects Node.js 18 or higher. The script uses modern ESM syntax (import statements) and fs/promises APIs that require contemporary Node versions.
Why is my frontend not showing updated cases after editing Markdown?
The Vite development server does not watch docs/ files for changes. After modifying source Markdown, you must manually run npm run generate:site-data to rebuild data/cases.json, then restart the dev server.
Can I regenerate both site data and style skills in one command?
While no single script combines both, the predev and prebuild npm hooks automatically execute both generate:site-data and generate:style-skill before their respective main commands, ensuring synchronized regeneration.
What happens if data/cases.json already exists?
The generation script unconditionally overwrites the file. It creates the data/ directory if missing, then writes fresh JSON, making repeated regeneration safe and idempotent.
Have a question about this repo?
These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:
curl -s "https://instagit.com/install.md" Maintain an open-source project? Get it listed too →