make EXPO_PUBLIC accessible to storybook

main.ts

import { StorybookConfig } from "@storybook/react-native-web-vite";
import { InlineConfig, mergeConfig } from "vite";

const main: StorybookConfig = {
  stories: ["../components/**/*.stories.@(js|jsx|ts|tsx)"],

  addons: ["@storybook/addon-docs", "@chromatic-com/storybook"],

  framework: {
    name: "@storybook/react-native-web-vite",
    options: {},
  },
  viteFinal: (config) => {
    return mergeConfig(config, {
      define: Object.entries(process.env).reduce((acc, [key, value]) => {
        if (key.startsWith("EXPO_PUBLIC_")) {
          acc[`process.env.${key}`] = JSON.stringify(value);
        }
        return acc;
      }, {} as Record<string, string>),
    } satisfies InlineConfig);
  },
  // env: ,
};

export default main;

This will take EXPO_PUBLIC_ env variables and include them in the vite environment as process.env.EXPO_PUBLIC_[name-of-env]