---
title: "Injecting Environment Variables Dynamically in Cloudflare Pages"
description: "How to inject environment variables dynamically in a Cloudflare Pages application?"
source: "https://www.launchfa.st/blog/injecting-env-cloudflare-pages"
author: "Rishi Raj Jain"
created_at: 2024-06-13T00:00:00.000Z
updated_at: 2026-07-02T00:00:00.000Z
---

> **Site index for agents**
> Fetch https://www.launchfa.st/llms.txt to discover every page on this site.
> Every page is also available as Markdown by appending `.md` to its URL.

<img width="1600" height="900" alt="Injecting Environment Variables Dynamically in Cloudflare Pages" decoding="async" loading="eager" class="mt-4 border rounded-sm bg-cover bg-center bg-no-repeat transform will-change-auto" src="https://ik.imagekit.io/vjeqenuhn/launchfast-website/injecting-env-cloudflare-pages" />

In this guide, you will learn how to inject environment variables dynamically in a Cloudflare Pages application.

## Prerequisites

You'll need the following:

- [Node.js 20](https://nodejs.org/en/blog/announcements/v20-release-announce) or later
- A [Cloudflare](https://pages.cloudflare.com/) account

## Dynamic Environment Variables via wrangler.toml

As Cloudflare Pages configuration via wrangler.toml is now in [open beta](https://developers.cloudflare.com/pages/functions/wrangler-configuration/), you can use this file as your environment variable manager (apart from the Environment Variables defined in the Cloudflare Pages Settings of your project).

As denoted in the [example wrangler.toml](https://developers.cloudflare.com/pages/functions/wrangler-configuration/#example-wranglertoml-file) file, all the variables in the `[vars]` are deployed to Cloudflare Pages.

You get the idea - dynamically insert your environment variables into the `[vars]` as key-value pairs. **This becomes handy when you're trying to provision something in your CI/CD pipeline and then you require the generated values to be used as environment variables.**

A simple script to do the same would be as follows:

```bash
echo "[vars]" >> wrangler.toml
echo "MY_ENV_NAME=MY_ENV_VALUE" >> wrangler.toml
```

But that's not all, there's one more gotcha with using wrangler.toml with Cloudflare Pages during deployment. You need to use the latest CLI instead of their outdated GitHub Action.

## Deploy to Cloudflare Pages

You will need to use the Wrangler CLI to deploy your application to Cloudflare Pages. Run the following command to deploy (after, if your application has a build step):

```bash
npx wrangler@latest pages deploy --project-name="<name>"
```

<small>(Make sure that you are using the latest version of Wrangler CLI to deploy to Cloudflare Pages)</small>

## Conclusion

In this guide, you learned how to inject environment variables dynamically in Cloudflare Pages.

If you have any questions or comments, feel free to reach out to me on [Twitter](https://twitter.com/direct_messages/create/rishi_raj_jain_).