Skip to content

Surface wrangler.toml [vars] as environment variables locally so they can be accessed by SvelteKit's import methods #12191

Open
@mstibbard

Description

Describe the problem

Local development requires environment variables and secrets to exist in .env if they are to be accessed by SvelteKit's import methods

A successful deployment to Cloudflare requires:

  • environment variables to exist in wrangler.toml under the [vars] section; and
  • secrets to be created and encrypted in the Project dashboard

As a result the developer must maintain parity between the .env environment variables and the wrangler.toml environment variables (the latter of which is commonly committed to version control)

I've created a self-contained repo to demonstrate the issue/annoyance: https://github.com/mstibbard/sk-cf-env-vars

Describe the proposed solution

Surface the wrangler.toml [vars] items as environment variables locally so they are accessible via the standard SvelteKit approach:

import { PUBLIC_STATIC_VAR } from '$env/static/public';
import { env } from '$env/dynamic/public';

let dynamic = env.PUBLIC_VAR

Alternatives considered

1. Access environment variables and secrets via Cloudflare Bindings (instead of SvelteKit imports)

The environment variables under [vars] are currently exposed and accessible to SvelteKit if you access them as a binding (E.g., platform.env.NAME). Using this is plausible however it means both secrets and environment variables are only accessible via server routes and need to be passed around via load functions if required client-side

2. Maintain parity between .env and wrangler.toml manually

This is what I currently do, but it frequently results in needing new commits because I've forgotten to update an environment variable in wrangler.toml and you can't update them in your Cloudflare project through any other method (for Production)

Note: Preview environment variables can be created in the Project dashboard

Importance

would make my life easier

Additional Information

No response

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions