vercel__workflow/packages/web/vite.config.ts

import { reactRouter } from '@react-router/dev/vite';
import tailwindcss from '@tailwindcss/vite';
import { defineConfig } from 'vite';

// When `true`, we're building the `packages/web` project for deployment to
// Vercel itself (as opposed to local development, publishing to npm, or being
// packed as a tarball by the `docs` deployment — all of which produce the
// standard self-hosted layout that `server.js` expects).
const isVercelWebDeployment = process.env.WORKFLOW_WEB_VERCEL_BUILD === '1';

export default defineConfig(({ command, isSsrBuild }) => ({
  build: {
    // Use Express server entry for self-hosting (node server.js).
    // On the web Vercel deployment, the React Router preset handles the
    // server entry.
    rollupOptions:
      isSsrBuild && !isVercelWebDeployment
        ? { input: './server/app.ts' }
        : undefined,
    // Disable minification so the published npm package contains readable
    // code. Without this, Vite's esbuild minifier produces single-line
    // mega-bundles that supply-chain security scanners (e.g. Socket) flag
    // as "obfuscated code". The app is a self-hosted observability tool
    // where the unminified size difference is negligible — gzip/brotli at
    // the serving layer compresses the wire payload regardless.
    minify: false,
  },
  // Bundle all dependencies into the server build so that @workflow/web
  // can be installed and run without needing any of the UI dependencies
  // (Radix, lucide-react, etc.) at runtime. Only Node.js built-ins and
  // express (needed by server.js) remain external.
  //
  // During dev (`react-router dev`), Vite's SSR module runner evaluates
  // modules using its ESM evaluator which cannot handle CJS packages
  // (they fail with "module/exports is not defined"). We disable
  // noExternal for dev so dependencies are loaded natively by Node.js.
  ssr: {
    noExternal: command === 'build' ? true : undefined,
    external: isVercelWebDeployment ? undefined : ['express'],
  },
  plugins: [tailwindcss(), reactRouter()],
  resolve: {
    // Ensure all workspace packages resolve React from the same location
    // to prevent duplicate React instances (which cause "Invalid hook call"
    // errors). This is necessary during dev when noExternal is not set and
    // linked workspace packages might resolve their own copy of React.
    dedupe: ['react', 'react-dom'],
    alias: [{ find: '~', replacement: '/app' }],
  },
}));