Prerequisites for Running awesome‑gpt‑image‑2: Complete Setup Guide

You need Node.js ≥14, npm, a Supabase project with CLI access, and a configured .env file to run awesome‑gpt‑image‑2; optional Alipay credentials enable paid‑community features.

The freestylefly/awesome‑gpt‑image‑2 repository is a Vite‑powered React application that generates images using OpenAI or Azure APIs, with backend services hosted on Supabase. Before you can run the dev server or deploy to production, several system‑level and service‑level dependencies must be satisfied. This guide walks through every prerequisite with specific file references and runnable commands.

---

Core Runtime Requirements

Node.js and Package Manager

The project requires Node.js version 14 or higher. This threshold ensures native ES‑module support, which the build pipeline relies on.

In package.json, the engine field explicitly constrains the Node version:

{
  "engines": {
    "node": ">=14"
  }
}

All npm scripts—including predev, generate:site-data, and generate:style-skill—execute through Node. You may use npm, Yarn, or PNPM interchangeably.

Install dependencies with:

npm install

---

Vite (Installed Automatically)

Vite serves as both the development server and production bundler. It is listed as a dependency in package.json and does not require global installation.

The configuration in vite.config.js defines proxy rules for API routes, routing /api/* requests to the local backend during development.

---

Backend Infrastructure: Supabase

Supabase Project and CLI

The application stores user data, authentication state, credits, and billing records in Supabase. You must:

1. Create a Supabase project via the dashboard or CLI.
2. Install the Supabase CLI locally.
3. Apply the schema migrations found in supabase/migrations/.

The migrations folder contains SQL files defining tables for users, credits, purchases, and related entities. Apply them with:

supabase db push

# or for a fresh reset

supabase db reset

---

Environment Variables for Supabase

The frontend initializes its Supabase client in src/supabaseClient.js. This file expects two variables at build time:

• VITE_SUPABASE_URL
• VITE_SUPABASE_ANON_KEY

Copy the template and populate your values:

cp .env.example .env

Edit .env with your project URL and anonymous key from the Supabase dashboard.

---

Optional: Alipay Payment Integration

If you intend to enable paid‑community features, you must configure Alipay credentials. The integration code resides in api/community/alipay/.

Required environment variables (see docs/alipay-web-payment.md):

• ALIPAY_APP_ID
• ALIPAY_APP_PRIVATE_PKCS_KEY — private key without PEM headers
• ALIPAY_PUBLIC_KEY — Alipay's public key

For local testing, start the sandbox server:

node scripts/alipay-webpay-sandbox-server.mjs

---

Quick‑Start Command Sequence

Execute these steps in order after satisfying the prerequisites above:

# 1. Clone repository

git clone https://github.com/freestylefly/awesome-gpt-image-2.git
cd awesome-gpt-image-2

# 2. Install dependencies

npm install

# 3. Configure environment

cp .env.example .env

# → Edit VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY

# 4. (Optional) Apply database schema

supabase db push

# 5. Generate static data and start dev server

npm run predev   # runs generate:site-data + generate:style-skill

npm run dev      # launches http://localhost:5173

---

Key Configuration Files

File	Purpose
package.json	Dependencies, engine constraints, and npm scripts
vite.config.js	Dev server proxy and build configuration
.env.example	Template for all required environment variables
src/supabaseClient.js	Frontend Supabase client initialization
supabase/migrations/	Database schema definitions
docs/alipay-web-payment.md	Alipay integration guide
scripts/generate-site-data.mjs	Builds static JSON for gallery and prompts
scripts/generate-style-skill.mjs	Packages style library as installable skill

---

Production Build Prerequisites

The same environment applies for production builds. Run:

npm run prebuild   # regenerates site data and style skill

npm run build      # outputs to ./dist

npm run preview    # verifies the build locally

Ensure your production environment supplies the same .env variables, or configure them through your hosting platform's secret management.

---

Summary

• Node.js ≥14 and npm are mandatory for all build and runtime operations.
• Supabase project with applied migrations provides authentication, storage, and billing data layers.
• .env file must contain VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY at minimum.
• Alipay credentials are only required for enabling paid‑community payment flows.
• Vite handles development and bundling automatically after npm install.

---

Frequently Asked Questions

Do I need a Supabase account to run awesome‑gpt‑image‑2 locally?

Yes. The frontend in src/supabaseClient.js attempts to connect to Supabase on initialization. Without valid credentials, authentication and credit‑tracking features will fail. You can create a free‑tier Supabase project and apply the migrations in supabase/migrations/ to satisfy this requirement.

Can I use Yarn or PNPM instead of npm?

Yes. The package.json does not lock the package manager. Both Yarn and PNPM are compatible, though the documentation examples use npm commands. Ensure your chosen manager respects the "node": ">=14" engine constraint.

What happens if I skip the Alipay setup?

The application runs fully without Alipay. The payment integration in api/community/alipay/ is gated by environment variable checks. Omitting ALIPAY_APP_ID and related keys simply disables paid‑community features; image generation and core gallery functionality remain available.

Which port does the development server use?

By default, Vite serves on port 5173. This is configured in vite.config.js and can be overridden with the --port flag or PORT environment variable.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}