vite.config.ts

import {croct} from '@croct/plug-hydrogen/vite';
import {fileURLToPath} from 'node:url';
import {defineConfig} from 'vite';
import {hydrogen} from '@shopify/hydrogen/vite';
import {oxygen} from '@shopify/mini-oxygen/vite';
import {reactRouter} from '@react-router/dev/vite';

// Vercel deployments run on Node.js instead of Oxygen's worker runtime:
// the Oxygen plugin is dropped, the SSR bundle uses the Vercel server
// entrypoint, and React DOM streams through the Web Streams build.
const isVercel = process.env.VERCEL === '1';

export default defineConfig(({isSsrBuild}) => ({
  plugins: [
    hydrogen(),
    ...(isVercel ? [] : [oxygen()]),
    reactRouter(),
    croct(),
  ],
  resolve: {
    alias: {
      // Vite's native tsconfig path resolver does not cover JavaScript
      // projects that use jsconfig.json, so define Hydrogen's app alias here.
      '~': fileURLToPath(new URL('./app', import.meta.url)),
      ...(isVercel && isSsrBuild
        ? {'react-dom/server': 'react-dom/server.browser'}
        : {}),
    },
    tsconfigPaths: true,
  },
  build: {
    // Allow a strict Content-Security-Policy
    // without inlining assets as base64:
    assetsInlineLimit: 0,
    ...(isVercel && isSsrBuild
      ? {rollupOptions: {input: './server/vercel.ts'}}
      : {}),
  },
  ssr: {
    // The Croct SDK imports the virtual config module generated by the
    // croct() plugin, so it must be bundled rather than externalized
    ...(isVercel ? {noExternal: [/^@croct\//]} : {}),
    optimizeDeps: {
      /**
       * Include dependencies here if they throw CJS<>ESM errors.
       * For example, for the following error:
       *
       * > ReferenceError: module is not defined
       * >   at /Users/.../node_modules/example-dep/index.js:1:1
       *
       * Include 'example-dep' in the array below.
       * @see https://vitejs.dev/config/dep-optimization-options
       */
      include: [
        'react-router > set-cookie-parser',
        'react-router > cookie',
        'react-router',
      ],
    },
  },
  server: {
    allowedHosts: ['.tryhydrogen.dev'],
  },
}));