{"id":22555,"library":"vite-envs","title":"vite-envs","description":"Vite plugin (v4.6.2, actively maintained) that enables dynamic injection of environment variables at container startup rather than build time. Designed for Dockerized Vite apps, it generates a shell script during build that populates import.meta.env and index.html placeholders (e.g., %FOO%) at runtime. Unlike standard Vite which requires rebuilding for env changes, vite-envs allows deploying a single Docker image configurable via --env flags. Supports type-safe imports with hot reload, optional EJS in HTML, and explicit variable declaration. Does not require the VITE_ prefix.","status":"active","version":"4.6.2","language":"javascript","source_language":"en","source_url":"git://github.com/garronej/vite-envs","tags":["javascript","react","vite","environment-variables","typescript"],"install":[{"cmd":"npm install vite-envs","lang":"bash","label":"npm"},{"cmd":"yarn add vite-envs","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-envs","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency; plugin runs as Vite plugin.","package":"vite","optional":false}],"imports":[{"note":"ESM-only; CJS require() fails in modern Vite configs.","wrong":"const viteEnvs = require('vite-envs')","symbol":"viteEnvs","correct":"import { viteEnvs } from 'vite-envs'"},{"note":"viteEnvs is also the default export; both syntaxes work.","wrong":"import { default } from 'vite-envs'","symbol":"default import","correct":"import viteEnvs from 'vite-envs'"},{"note":"Utility for type-safe env variable declarations; available since v4.","wrong":null,"symbol":"defineEnvVars","correct":"import { defineEnvVars } from 'vite-envs'"}],"quickstart":{"code":"// vite.config.ts\nimport { defineConfig } from 'vite';\nimport react from '@vitejs/plugin-react';\nimport { viteEnvs } from 'vite-envs';\n\nexport default defineConfig({\n  plugins: [\n    react(),\n    viteEnvs({\n      // Declare env vars (optional, but required for type generation)\n      declaration: {\n        FOO: 'VITE_FOO', // default value\n        BAR: 'default_bar'\n      }\n    })\n  ]\n});\n\n// .env file (if not using declaration)\nVITE_FOO=hello\nBAR=world\n\n// In your TypeScript code:\nconsole.log(import.meta.env.FOO); // 'hello' at runtime\nconsole.log(import.meta.env.BAR); // 'world'\n\n// Docker usage:\n// docker run --env FOO=\"xyz\" --env BAR=\"abc\" my-image","lang":"typescript","description":"Minimal Vite config using viteEnvs plugin. Shows declaration, .env fallback, and runtime access via import.meta.env."},"warnings":[{"fix":"Update Dockerfile to run ./vite-envs.sh before starting server (see README).","message":"vite-envs v4 generates a shell script (vite-envs.sh) rather than directly modifying the bundle. Previous versions (<4) used a different injection mechanism.","severity":"breaking","affected_versions":"<4.0.0"},{"fix":"List all expected variables in a .env file (or use the declaration option in vite.config.ts).","message":"Environment variables not declared in .env (or .env.declaration) will NOT be injected at runtime, even if present in the host environment. This is a security feature.","severity":"gotcha","affected_versions":">=4.0.0"},{"fix":"Use explicit declaration for all env vars to avoid surprises.","message":"The VITE_ prefix is NOT required, but if you omit it, you must ensure the variable is declared. Mixing VITE_ and non-VITE_ variables can cause confusion.","severity":"gotcha","affected_versions":">=4.0.0"},{"fix":"Avoid relying on internal global names; use the default behavior.","message":"In v4.6.0+, you can overwrite the global name via the plugin option nameOfTheGlobalOld. This may change in future versions.","severity":"deprecated","affected_versions":">=4.6.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"npm install vite-envs --save-dev && ensure tsconfig.json includes 'node' in moduleResolution or 'moduleResolution': 'bundler'.","cause":"Package not installed or TypeScript config missing module resolution for vite-envs.","error":"Cannot find module 'vite-envs' or its corresponding type declarations."},{"fix":"Use 'import { viteEnvs } from 'vite-envs'; or 'import viteEnvs from 'vite-envs';'","cause":"Importing viteEnvs incorrectly (e.g., as default export when using named import syntax).","error":"TypeError: viteEnvs is not a function"},{"fix":"Add FOO to your .env file (even with a dummy value) or use the declaration option in viteEnvs().","cause":"FOO not listed in .env file or plugin declaration, so vite-envs.sh does not include it.","error":"env variable FOO is not being injected at runtime"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}