Workers - Wrangler and the Cloudflare Vite plugin support `.env` files in local development
11mo ago
Source
CloudflareWorkers - Wrangler and the Cloudflare Vite plugin support `.env` files in local developmentcloudflare.comNow, you can use .env files to provide secrets and override environment variables on the env object during local development with Wrangler and the Cloudflare Vite plugin. Previously in local development, if you wanted to provide secrets or environment variables during local development, you had to use .dev.vars files. This is still supported, but you can now also use .env files, which are more familiar to many developers. Using .env files in local development You can create a .env file in your project root to define environment variables that will be used when running wrangler dev or vite dev . The .env file should be formatted like a dotenv file, such as KEY="VALUE" : TITLE = "My Worker" API_TOKEN = "dev-token" When you run wrangler dev or vite dev , the environment variables defined in the .env file will be available in your Worker code via the env object: export default { async fetch ( request , env ) { const title = env . TITLE ; // "My Worker" const apiToken = env . API_TOKEN ; // "dev-token" const response = await fetch ( ` ${ apiToken } ` , ) ; return new Response ( `Title: ${ title } - ` + ( await response . text ())) ; }, }; Multiple environments with .env files If your Worker defines multiple environments , you can set different variables for each environment (ex: production or staging) by creating files named .env. . When you use wrangler --env or CLOUDFLARE_ENV= vite dev , the corresponding environment-specific file will also be loaded and merged with the .env file. For example, if you want to set different environment variables for the staging environment, you can create a file named .env.staging : API_TOKEN = "staging-token" When you run wrangler dev --env staging or CLOUDFLARE_ENV=staging vite dev , the environment variables from .env.staging will be merged onto those from .env . export default { async fetch ( request , env ) { const title = env . TITLE ; // "My Worker" (from `.env`) const apiToken = env . API_TOKEN ; // "staging-token" (from `.env.staging`, overriding the value from `.env`) const response = await fetch ( ` ${ apiToken } ` , ) ; return new Response ( `Title: ${ title } - ` + ( await response . text ())) ; }, }; Find out more For more information on how to use .env files with Wrangler and the Cloudflare Vite plugin, see the following documentation: Environment variables and secrets Wrangler Documentation Cloudflare Vite Plugin Documentation
You might also wanna read
Cloudflare expands AI bot management tools with granular traffic controls for all customers
Cloudflare is celebrating the second "Content Independence Day" by expanding AI traffic management options for all website owners. Building
Workers - Simpler runtime types with @cloudflare/workers-types v5
Cloudflare·2d ago
AI Search - Manage AI Search sync jobs with Wrangler CLI
Cloudflare·3d ago
Workers - Work across multiple accounts with Wrangler auth profiles
Cloudflare·3d ago
Cache - Cache multiple versions of a URL with Vary
Cloudflare·3d ago
Cloudflare One - Hostname routing for Cloudflare Mesh
Cloudflare·3d ago

Comments
Sign in to join the conversation.
No comments yet. Be the first.