react-vite-best-practices

Context Poisoning

Supply Chain Compromise

Risky tool definition detected

# .env.staging — loaded with: vite build --mode staging VITE_API_URL=https://staging-api.example.com VITE_FEATURE_DEBUG=true VITE_SENTRY_DSN=https://abc@sentry.io/456 ``` ```bash # ✅ Good — use --mode to target specific environment files npx vite dev # loads .env + .env.development npx vite build # loads .env + .env.production npx vite build --mode staging # loads .env + .env.staging ``` ``` # Priority order (higher overrides lower): # 1.

Tool passed security scan

Supply Chain Compromise

Data Exfiltration

Risky tool definition detected

## Incorrect ```env # ❌ Bad — secrets with VITE_ prefix are EXPOSED in the browser bundle VITE_DATABASE_URL=postgres://user:password@db.example.com:5432/mydb VITE_API_SECRET=sk_live_abc123def456 VITE_STRIPE_SECRET_KEY=sk_live_789xyz VITE_JWT_SIGNING_KEY=super-secret-key-123 VITE_AWS_SECRET_ACCESS_KEY=wJalrXUtnFEMI/K7MDENG ``` ```typescript // ❌ Bad — calling external APIs directly with secrets from client const response = await fetch('https://api.stripe.com/v1/charges', { headers: { Authorizatio

Tool passed security scan