Environment Variables

Manage local and production values, public and secret visibility — all from the Studio.

Environment tab in ChromeShip Studio

Add / Edit a variable

Click Add variable or click an existing row to edit. Each variable has two independent axes:

Add variable modal showing local vs production fields and public/secret toggle

Two dimensions

Every variable has two independent axes:

  • Visibilitypublic values can be read by extension code. secret values are backend-only and never enter the extension bundle.
  • Environmentlocal values are used during chromeship dev. production values are used for ZIP builds and deployed functions.

Generated files

ChromeShip writes four env files automatically. You never edit these by hand:

  • .env.local.public — public values for local dev
  • .env.production.public — public values for production builds
  • .env.local.secret — secrets for local functions
  • .env.production.secret — secrets for deployed functions

A Vite plugin reads the public files at build time and injects the values into a global __CHROMESHIP_ENV__ object. For content scripts, values are inlined directly into the bundle to avoid CSP issues.

Use in extension code

Public variables only. If a variable is secret, call a Supabase Edge Function instead — the function reads it from Deno.env.get().

import { env, requireEnv } from "@/shared/lib/env";

const apiUrl = requireEnv("SUPABASE_URL");       // throws if missing
const optional = env("PUBLIC_FEATURE_FLAG");      // "" if missing

Use in Edge Functions

// In supabase/functions/my-function/index.ts
const stripeKey = Deno.env.get("STRIPE_SECRET_KEY");
const supabaseUrl = Deno.env.get("SUPABASE_URL");

Supabase-managed variables

SUPABASE_URL and SUPABASE_ANON_KEY are managed by ChromeShip for both local and production. You never create or edit them. The local values point to your project-isolated Supabase stack; the production values come from your remote Supabase project.