Cloudflare Developers•2mo ago

Setting Different Env Vars & Build Commands for Preview/Prod

Hey, 👋 . Starting out a new project, and in the spirit of moving away from Pages to Workers, wanted to ask for some help with deploying a SvelteKit and Convex app. For starters, how does one set different environment variables for preview and prod? I need these, for example, different in both environments

CONVEX_DEPLOYMENT
PUBLIC_CONVEX_URL
PUBLIC_CONVEX_SITE_URL
SITE_URL
GOOGLE_CLIENT_ID
GOOGLE_CLIENT_SECRET

CONVEX_DEPLOYMENT
PUBLIC_CONVEX_URL
PUBLIC_CONVEX_SITE_URL
SITE_URL
GOOGLE_CLIENT_ID
GOOGLE_CLIENT_SECRET

In the past, on Pages, it was simple as Choose Environment: and adding different variables and build configurations. Speaking of, how does one set a different build command for each environment?

7 Replies

texan•2mo ago

This is a bit different in Workers than Pages. You'll want two separate Workers under the hood, but can manage this with 1 wrangler file (and 1 repository) using wrangler environments: https://developers.cloudflare.com/workers/wrangler/configuration/#environments You'll technically have 1 Worker for each environment, but each will have its own set of bindings/variables. You can set up your wrangler config to use the same bindings between environments if you like. You'd then set up WCI builds on your production environment. Your main deploy command will be to your production worker (eg. npx wrangler deploy), and you would want to enable preview builds, where the non-production deploy command would do a versions upload to your staging worker (using the wrangler environments -- npx wrangler versions upload -e staging)

Cloudflare Docs

Configuration

Use a configuration file to customize the development and deployment setup for your Worker project and other Developer Platform products.

DavisOP•3w ago

Hello, @Will Taylor | Workers Thanks, and sorry for the late reply, just got around to this. I have a couple of follow-up questions if you'd spare the time: --- Following the above, I went ahead and updated my wrangler.jsonc to this:

/**
 * For more details on how to configure Wrangler, refer to:
 * https://developers.cloudflare.com/workers/wrangler/configuration/
 */
{
    "$schema": "node_modules/wrangler/config-schema.json",
    "name": "ibimanuka",
    "main": ".svelte-kit/cloudflare/_worker.js",
    "compatibility_date": "2025-10-24",
    "compatibility_flags": ["nodejs_als", "nodejs_compat_v2"],
    "assets": {
        "binding": "ASSETS",
        "directory": ".svelte-kit/cloudflare"
    },
    "observability": {
        "enabled": true
    },
    // ---- STAGING ----
    "env": {
        "staging": {
            "vars": {
                "PUBLIC_CONVEX_URL": "foo",
                "PUBLIC_CONVEX_SITE_URL": "foo"
            }
        },
        // ---- PRODUCTION ----
        "production": {
            "vars": {
                "PUBLIC_CONVEX_URL": "bar",
                "PUBLIC_CONVEX_SITE_URL": "bar"
            }
        }
    }
}

/**
 * For more details on how to configure Wrangler, refer to:
 * https://developers.cloudflare.com/workers/wrangler/configuration/
 */
{
    "$schema": "node_modules/wrangler/config-schema.json",
    "name": "ibimanuka",
    "main": ".svelte-kit/cloudflare/_worker.js",
    "compatibility_date": "2025-10-24",
    "compatibility_flags": ["nodejs_als", "nodejs_compat_v2"],
    "assets": {
        "binding": "ASSETS",
        "directory": ".svelte-kit/cloudflare"
    },
    "observability": {
        "enabled": true
    },
    // ---- STAGING ----
    "env": {
        "staging": {
            "vars": {
                "PUBLIC_CONVEX_URL": "foo",
                "PUBLIC_CONVEX_SITE_URL": "foo"
            }
        },
        // ---- PRODUCTION ----
        "production": {
            "vars": {
                "PUBLIC_CONVEX_URL": "bar",
                "PUBLIC_CONVEX_SITE_URL": "bar"
            }
        }
    }
}

but my builds fail because those variables can't be accessed. (And yes, I have preview URLs enabled.) Any hints as to what I can do to fix this? --- Another question: --- How can I set 2 build commands for both environments. For staging, I just want to run pnpm build, but for production, convex requires that you first deploy it because building your app with something like this: npx convex deploy --cmd='pnpm run build' The latter makes use of a [secret] CONVEX_DEPLOY_KEY. --- P.S. The whole experience with workers is really confusing compared to pages. Really hoping this can be improved. 🙂

texan•3w ago

Are those variables needed during build time or during runtime? If it’s build time, you set it in the build variable section of worker settings. You can’t set two different commands unfortunately. You could make an npm target and inside that script you figure out which command to run… but yeah that’s clunky. Agreed that environments are very confusing. There’s not a 1:1 with pages, and wrangler environments is only solving one piece. Absolutely will pass along feedback!

DavisOP•3w ago

@Will Taylor | Workers thanks for taking the time.

Are those variables needed during build time or during runtime?

During build, I believe. Also runtime, if I'm not mistaken. (Sorry for the vagueness, first time using Convex 🙁). I tried setting some random values in the build variable section, but it looks like they always take precedence over those specified in my wrangler config. i.e

Failed to setup Convex client: Error: Invalid deployment address: Must start with "https://" or "http://". Found "PUBLIC_CONVEX_URL".

Failed to setup Convex client: Error: Invalid deployment address: Must start with "https://" or "http://". Found "PUBLIC_CONVEX_URL".

Here, I just set the variable to it's own name for the sake of passing the build. Which kind of brings us back to the initial question, no? How can I specify 2 for both the staging and prod envs. (regardless of whether it is build or runtime) --- P.S. A piece of feedback. It would be great if observability could work for preview urls as well. Had to first merge into main (prod) to even understand why I couldn't access my site through the preview URLs. --- P.P.S. I can forgo the custom build scripts for now. Will be forced to manually deploy convex each time, but hey, at least I can. Though, would be be great having this feature as well. 🙂

Thilak•3w ago

You literally saved my time. I didn't know we have 2 variables sections called build variables and runtime variables within cloudflare workers. Your words helped me solve a different issue with Next.js build with environment variables.

DavisOP•2w ago

@Will Taylor | Workers (sorry for the ping) do you mind helping me out. Still running into this issue. I set 2 different sets of keys in my wrangler.jsonc, and I also set dummy keys on the cloudflare dashboard (without, the build fails), but the dummy ones set always take replace the ones set in my wrangler config. Any workarounds that you can think of? Thanks.

texan•2w ago

Not sure I totally understand. How are you deploying?

Gaming

Programming

Setting Different Env Vars & Build Commands for Preview/Prod

Did you find this page helpful?