Skip to content

feat: add frontend env var validation at build time#615

Merged
Mystery-CLI merged 2 commits into
Ethereal-Future:mainfrom
darcszn:feat/env-var-validation
May 30, 2026
Merged

feat: add frontend env var validation at build time#615
Mystery-CLI merged 2 commits into
Ethereal-Future:mainfrom
darcszn:feat/env-var-validation

Conversation

@darcszn
Copy link
Copy Markdown
Contributor

@darcszn darcszn commented May 29, 2026

Summary

Adds two-layer validation of required VITE_* environment variables so a
production build with a missing VITE_API_URL fails loudly instead of
shipping a silently broken app.

Changes

frontend/src/env.js (new)

  • ENV_SCHEMA defines every VITE_* variable with a required flag, description,
    and optional format validator
  • VITE_API_URL is required and validated as a well-formed URL
  • VITE_VAPID_PUBLIC_KEY and VITE_CDN_URL are optional but validated if present
  • Production: throws before the app renders if any required var is missing
  • Development: console.warn only, so local work is unblocked without a full .env
  • Exports API_URL, VAPID_PUBLIC_KEY, CDN_URL as named constants

frontend/src/main.jsx

  • import './env.js' added as the very first import — runs before React,
    the store, or any component is touched

frontend/vite.config.js

  • envValidationPlugin uses Vite's configResolved hook to fail vite build
    immediately if required vars are absent
  • Switched base from process.env to loadEnv for consistent .env resolution

frontend/.env.example (new)

  • Documents all VITE_* variables with required/optional labels and examples
  • Points to both validation locations (src/env.js and vite.config.js)

Testing

  • Missing VITE_API_URL in production build → vite build exits with clear error
  • Missing VITE_API_URL in dev → console.warn, app still loads
  • Invalid URL value → caught by the validate function in ENV_SCHEMA
  • All optional vars absent → no errors, app renders normally
    closes Add frontend environment variable validation at build time #469

- Add frontend/src/env.js with ENV_SCHEMA covering all VITE_* vars
  - VITE_API_URL marked required with URL format validation
  - VITE_VAPID_PUBLIC_KEY and VITE_CDN_URL documented as optional
  - Strict mode (production) throws on missing/invalid required vars
  - Dev mode warns via console.warn so local work is unblocked
- Import env.js as first import in main.jsx so validation runs before
  React or any component is initialised
- Add envValidationPlugin to vite.config.js using configResolved hook
  to fail vite build early when required vars are absent
- Switch vite base from process.env to loadEnv for consistent .env
  file resolution
- Update frontend/.env.example with all VITE_* vars, required/optional
  labels, examples, and pointers to both validation locations
@drips-wave
Copy link
Copy Markdown

drips-wave Bot commented May 29, 2026

@darcszn Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@Mystery-CLI Mystery-CLI merged commit 0fad9e9 into Ethereal-Future:main May 30, 2026
10 of 21 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add frontend environment variable validation at build time

2 participants