vite.config.ts

import { defineConfig } from "vite";
import svgr from "vite-plugin-svgr";
import ViteRestart from "vite-plugin-restart";
// @ts-expect-error - spiffThemePlugin export may not be in type definitions yet
import { spiffThemePlugin } from "@spiffcommerce/theme-bridge/plugin";
import { configurationSchema, pageSettings } from "./src/configurationSchema";
import { existsSync, readFileSync } from "fs";

// https://vitejs.dev/config/
export default defineConfig((env) => {
    const configurationPath = `./.env.${env.mode}.json`;
    const themeConfiguration = existsSync(configurationPath) ? readFileSync(configurationPath, "utf-8") : undefined;
    return {
        base: "",
        define: {
            __LOCAL_DEV_CONFIGURATION__: themeConfiguration,
            "globalThis.__DEV__": JSON.stringify(false),
        },
        plugins: [
            svgr(),
            // The local configuration file is read when the config loads, so editing it needs a server restart.
            ViteRestart({ restart: [".env.*.json"] }),
            spiffThemePlugin({ configurationSchema, pageSettings, includePreloadChunks: false }),
        ],
        build: {
            emptyOutDir: true,
            rollupOptions: {
                output: {
                    entryFileNames: "assets/[name].js",
                    chunkFileNames: "assets/[name].chunk.js",
                    assetFileNames: "assets/[name].[ext]",
                    manualChunks(id, _meta) {
                        if (!id.includes("node_modules")) return;
                        if (id.includes("@spiffcommerce/preview-3d")) return "vendor-spiffcommerce-preview-3d";
                        if (id.includes("@spiffcommerce")) return "vendor-spiffcommerce";
                        return;
                    },
                },
            },
        },
        server: {
            port: 3333,
        },
        preview: {
            port: 3334,
        },
    };
});