Environment Variables

16.2.1. File Structure

Project Root/
├── .env                  # Common across all environments
├── .env.development      # Development environment (yarn dev)
├── .env.production       # Production environment (yarn build)
└── .env.local            # Local override (not tracked by Git)

---

16.2.2. Variable Naming

• Variables accessible from the client must use the VITE_ prefix.
• Variables without the VITE_ prefix are not included in the client bundle.

# .env.development
VITE_API_BASE_URL=http://localhost:8080/api
VITE_APP_TITLE=Flowin (Dev)

# .env.production
VITE_API_BASE_URL=https://api.flowin.tienipia.com
VITE_APP_TITLE=Flowin

---

16.2.3. Type Definitions

Type declarations must be provided for environment variables.

// src/env.d.ts
/// <reference types="vite/client" />

interface ImportMetaEnv {
  readonly VITE_API_BASE_URL: string
  readonly VITE_APP_TITLE: string
}

interface ImportMeta {
  readonly env: ImportMetaEnv
}

---

16.2.4. Usage

const apiBaseUrl = import.meta.env.VITE_API_BASE_URL

Caution

Sensitive information (API keys, secrets) must not be included in environment variables. They are exposed as-is in the client bundle.

---

16.2.5. Environment-Specific Configuration Priority

Vite loads environment variables in the following order of priority.

Priority	File	Description
1 (Highest)	.env.{mode}.local	Mode-specific local override
2	.env.{mode}	Mode-specific configuration
3	.env.local	Local override
4 (Lowest)	.env	Common defaults

• .env.local and .env.*.local files must be included in .gitignore.