{"id":13496457,"url":"https://github.com/ElMassimo/vite-plugin-environment","last_synced_at":"2025-03-28T18:32:03.698Z","repository":{"id":57393103,"uuid":"361877519","full_name":"ElMassimo/vite-plugin-environment","owner":"ElMassimo","description":"Easily expose environment variables in Vite.js","archived":false,"fork":false,"pushed_at":"2024-12-30T17:59:17.000Z","size":293,"stargazers_count":152,"open_issues_count":6,"forks_count":9,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-24T21:12:27.305Z","etag":null,"topics":["env","env-vars","environment-variables","vite","vite-plugin","vitejs"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ElMassimo.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-04-26T19:58:00.000Z","updated_at":"2025-03-13T07:45:15.000Z","dependencies_parsed_at":"2025-02-13T13:32:29.586Z","dependency_job_id":null,"html_url":"https://github.com/ElMassimo/vite-plugin-environment","commit_stats":{"total_commits":21,"total_committers":1,"mean_commits":21.0,"dds":0.0,"last_synced_commit":"438c3eb9dcb8362cae39d857aa4a8e993f585f62"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElMassimo%2Fvite-plugin-environment","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElMassimo%2Fvite-plugin-environment/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElMassimo%2Fvite-plugin-environment/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElMassimo%2Fvite-plugin-environment/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ElMassimo","download_url":"https://codeload.github.com/ElMassimo/vite-plugin-environment/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246080764,"owners_count":20720590,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["env","env-vars","environment-variables","vite","vite-plugin","vitejs"],"created_at":"2024-07-31T19:01:48.152Z","updated_at":"2025-03-28T18:32:03.691Z","avatar_url":"https://github.com/ElMassimo.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"\u003ch2 align='center'\u003e\u003csamp\u003evite-plugin-environment\u003c/samp\u003e\u003c/h2\u003e\n\n\u003cp align='center'\u003eExpose environment variables to your client code in \u003csamp\u003eVite.js\u003c/samp\u003e\u003c/p\u003e\n\n\u003cp align='center'\u003e\n  \u003ca href='https://www.npmjs.com/package/vite-plugin-environment'\u003e\n    \u003cimg src='https://img.shields.io/npm/v/vite-plugin-environment?color=222\u0026style=flat-square'\u003e\n  \u003c/a\u003e\n  \u003ca href='https://github.com/ElMassimo/vite-plugin-environment/blob/main/LICENSE.txt'\u003e\n    \u003cimg src='https://img.shields.io/badge/license-MIT-blue.svg'\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cbr\u003e\n\n[plugin]: https://github.com/ElMassimo/vite-plugin-environment\n[migration]: https://vite-ruby.netlify.app/guide/migration.html#migrating-to-vite\n[vite.js]: http://vitejs.dev/\n[EnvironmentPlugin]: https://webpack.js.org/plugins/environment-plugin/\n[define]: https://vite.dev/config/shared-options.html#define\n[Vite Ruby]: https://vite-ruby.netlify.app/config/#source-maps-%F0%9F%97%BA\n[meta env]: https://vitejs.dev/guide/env-and-mode.html#env-files\n[vite-plugin-env-compatible]: https://github.com/IndexXuan/vite-plugin-env-compatible\n\n## Why? 🤔\n\nAlthough [Vite.js] provides its [own mechanism][meta env] for exposing environment variables through [`import.meta.env`][meta env], sometimes it's not possible or desirable to prefix variables with `VITE_`.\n\nThis plugin is a shorthand for exposing environment variables by configuring \u003ckbd\u003e[define]\u003c/kbd\u003e.\n\nIt provides the same functionality as webpack's \u003ckbd\u003e[EnvironmentPlugin]\u003c/kbd\u003e, but for Vite.js.\n\n## Installation 💿\n\nInstall the package as a development dependency:\n\n```bash\nnpm i -D vite-plugin-environment # yarn add -D vite-plugin-environment\n```\n\n## Usage 🚀\n\nYou can provide a list of environment variable names to expose to your client code:\n\n```js\nimport { defineConfig } from 'vite'\nimport EnvironmentPlugin from 'vite-plugin-environment'\n\nexport default defineConfig({\n  plugins: [\n    EnvironmentPlugin(['API_KEY', 'DEBUG']),\n  ],\n})\n```\n\nAnd then use them as:\n\n```js\nconst apiKey = process.env.API_KEY\n```\n\n### Usage with default values\n\nYou may instead provide an object which maps keys to their default values.\n\nThe default value for a key is only used if the variable is not defined.\n\n```js\nEnvironmentPlugin({\n  // Uses 'development' if the NODE_ENV environment variable is not defined.\n  NODE_ENV: 'development',\n\n  // Have in mind that variables coming from process.env are always strings.\n  DEBUG: 'false',\n\n  // Required: will fail if the API_KEY environment variable is not provided.\n  API_KEY: undefined, \n \n  // Optional: will not fail if the APP_VERSION environment variable is missing.\n  APP_VERSION: null,\n}),\n```\n\nUse `null` for optional variables, or `undefined` for variables that __must__ be provided.\n\n## Configuration ⚙️\n\nHave in mind that you can add the plugin several times—passing different options to load different sets of variables.\n\n### Loading prefixed variables\n\nIn some cases, it's useful to load all environment variables with a certain prefix.\n\nYou can achieve that by passing `'all'` and providing the \u003ckbd\u003eprefix\u003c/kbd\u003e option.\n\n```js\nEnvironmentPlugin('all', { prefix: 'VUE_APP_' }),\nEnvironmentPlugin('all', { prefix: 'REACT_APP_' }),\n```\n\nand then use it as usual:\n\n```js\nprocess.env.VUE_APP_NOT_SECRET_CODE\n```\n\n### Exposing variables differently\n\nWhen porting apps to Vite or using SSR it can be useful to expose variables in `process.env`, which is the default.\n\nIn other cases, you may use the \u003ckbd\u003edefineOn\u003c/kbd\u003e option to expose them in a different object, such as `import.meta.env`.\n\n```js\nEnvironmentPlugin({ APP_VERSION: 'local' }, { defineOn: 'import.meta.env' }),\n```\n\nand then use it as:\n\n```js\nconst version = import.meta.env.APP_VERSION\n```\n\n### Ignoring `.env` files\n\nBy default the plugin will load `.env` files using the same [strategy][meta env] as Vite.js.\n\nIf you want to ignore `.env` files and only use values in `process.env`, you can opt out:\n\n```js\nEnvironmentPlugin(['API_KEY'], { loadEnvFiles: false }),\n```\n\n## Inside the box 📦\n\nThe first example in this README is equivalent to [manually configuring][define]:\n\n```js\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  define: {\n    'process.env.API_KEY': JSON.stringify(process.env.API_KEY),\n    'process.env.DEBUG': JSON.stringify(process.env.DEBUG),\n  }\n})\n```\n\nexcept it will also use any variables provided by your `.env` files, and will\n__fail__ if any of the specified variables is _not defined_.\n\n## Acknowledgements\n\nI created this library only because I wanted something that:\n\n- Reused Vite's `loadEnv` functionality, making the library _very_ light (no dependencies).\n- Allowed to provide a subset of variables to expose, and their defaults.\n\nThe following libraries might be helpful depending on your use case:\n\n- [vite-plugin-env-compatible]: Convenient if you are porting a Vue CLI or create-react-app. \n\n## License\n\nThis library is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FElMassimo%2Fvite-plugin-environment","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FElMassimo%2Fvite-plugin-environment","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FElMassimo%2Fvite-plugin-environment/lists"}