Use environment variables in Edge component code

In Components at Edge, the main function is exported from your entry point file (commonly a main.mjs file). The second argument, info, includes info.env, which exposes environment variable values that are in scope for your component in the current component set.

What to do

  1. Ensure the function signature is main(input, info) (or equivalent) for your entrypoint.

  2. Read values with info.env.`VARIABLE_NAME, matching names declared in the `manifest.json file. Read the Add environment variable declarations to the manifest documentation for more information.

  3. Add rendering or logic that depends on the value (as a string or your agreed-upon encoding).

  4. If a variable is optional, guard for undefined values before use.

Mnimal patterns in Edge follow this struture, using your names and output:

export default {
  async main(input, info) {
    const brandColor = info.env.BRAND_PRIMARY_COLOR;
    // ...
 },
}

Reference

Read the Use environment variables in your component code documentation in the Environment variables reference for a worked example, deployment notes, and testing steps.