Environment variables
VITE_* values for API base URL, Supabase, Stripe, and analytics.
1 min read
Overview
At runtime, the web app uses Vite environment variables (the VITE_* set).
When you change a value in your .env files, restart the web dev server or rebuild so Vite can load the new values.
Steps
Copy the development env template
Copy web/.env.development.example to web/.env.development.local.
Set required variables
Set:
- VITE_API_BASE_URL
- VITE_FRONTEND_DOMAIN_URL
- VITE_PUBLIC_SUPABASE_URL
- VITE_PUBLIC_STRIPE_PUBLISHABLE_KEY
- VITE_PUBLIC_GOOGLE_ANALYTICS_MEASUREMENT_ID
And choose the Stripe price IDs for your plans:
- VITE_PUBLIC_STRIPE_PRICE_ID_LITE_PLAN
- VITE_PUBLIC_STRIPE_PRICE_ID_BASIC_PLAN
- VITE_PUBLIC_STRIPE_PRICE_ID_STARTER_PACK
- VITE_PUBLIC_STRIPE_PRICE_ID_GROWTH_PACK
- VITE_PUBLIC_STRIPE_PRICE_ID_PROFESSIONAL_PACK
- VITE_PUBLIC_STRIPE_PRICE_ID_PAGE_1_YEAR_PACK
- VITE_PUBLIC_STRIPE_PRICE_ID_PAGE_LIFETIME_PACK
Set production env values
For deployment, ensure web/.env.production.local (or equivalent secret injection) contains the same key names with production values.
Tip: keep secrets in env files
Do not hard-code secrets in the source code. Use the `.env` files listed above and commit only the template/example files.