1.0.2 • Published 3 years ago
@gergoszaszvaradi/vite-env v1.0.2
@gergoszaszvaradi/vite-env
Extends vite.loadEnv.
It loads the actual environment variables from process.env and the specified .env and .env.* files (such as .env, .env.local, .env.development, .env.production)
Installation
npm i -D @gergoszaszvaradi/vite-envyarn add -D @gergoszaszvaradi/vite-envUsage
The package exports a fromEnv function that can be used to load environment variables. It uses the same strategy to load variables as the native Vite solution does.
vite.config.ts
import { defineConfig, loadEnv } from "vite";
// ...
import { fromEnv } from "@gergoszaszvaradi/vite-env";
export default defineConfig(({ mode }) => {
return {
// ...
define: fromEnv({ mode }),
};
});.env
MY_VAR=my_var_valueTypings for environment variables if the exposed path is import.meta.env
vite-env.d.ts
/// <reference types="vite/client" />
interface ImportMetaEnv {
readonly MY_VAR : string
// more env variables...
}
interface ImportMeta {
readonly env: ImportMetaEnv
}index.ts
console.log(import.meta.env.MY_VAR);Options
{
// The mode that vite provides. Uses the same way as loadEnv does.
mode : string,
// The directory where the .env* files are located. Default is process.cwd()
envDir ?: string;
// Only the variables with these prefixes are going to be loaded. Default is nothing.
prefixes ?: string | string[];
// Only the variables whose name is defined here are loaded. Default is undefined.
variables ?: string[];
// Where to expose the variable. Default is import.meta.env
defineOn ?: string;
}Using prefixes
vite.config.ts
// ...
define: fromEnv({ mode, prefixes: "VITE_" }),
// ...This will work the same way as loadEnv does. Only environment variables with the VITE_ prefix are loaded.
Using only specified variables
vite.config.ts
// ...
define: fromEnv({ mode, variables: ["API_URL", "API_KEY"] }),
// ...In this case only the API_URL and API_KEY variables are loaded and exposed to the application.