Genarrative/apps/ai-game-creator-shell/vite.config.ts

import { existsSync, readFileSync } from 'node:fs';
import { createRequire } from 'node:module';
import { dirname, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';

import tailwindcss from '@tailwindcss/vite';
import react from '@vitejs/plugin-react';
import { defineConfig } from 'vite';

const appRoot = dirname(fileURLToPath(import.meta.url));
const repoRoot = resolve(appRoot, '../..');
const appRequire = createRequire(resolve(appRoot, 'package.json'));
const reactFileManagerPackageRoot = dirname(
  appRequire.resolve('@cubone/react-file-manager/package.json'),
);

function resolveDevApiTarget() {
  const statePath = resolve(repoRoot, '.app/dev-stack.json');
  if (!existsSync(statePath)) {
    return 'http://127.0.0.1:8082';
  }
  try {
    const state = JSON.parse(readFileSync(statePath, 'utf8')) as {
      services?: {
        'api-server'?: {
          status?: string;
          url?: string;
        };
      };
    };
    const apiServer = state.services?.['api-server'];
    if (
      apiServer &&
      ['running', 'reused', 'starting'].includes(apiServer.status ?? '') &&
      apiServer.url
    ) {
      return apiServer.url;
    }
    return 'http://127.0.0.1:8082';
  } catch {
    return 'http://127.0.0.1:8082';
  }
}

const apiTarget = resolveDevApiTarget();

export default defineConfig({
  root: appRoot,
  plugins: [
    tailwindcss(),
    react(),
    {
      name: 'genarrative-ai-game-creator-dev-marker',
      configureServer(server) {
        server.middlewares.use(
          '/__agc_dev_server.json',
          (_request, response) => {
            response.setHeader(
              'Content-Type',
              'application/json; charset=utf-8',
            );
            response.end(
              JSON.stringify({
                schemaVersion: 1,
                app: 'ai-game-creator-shell',
                port: server.config.server.port,
                apiTarget,
              }),
            );
          },
        );
      },
    },
  ],
  resolve: {
    alias: [
      // v1.35.0 publishes this bundle but its package metadata points Vite at
      // an incomplete source entrypoint. Resolve only the bare module to the
      // published ESM artifact; its stylesheet remains a valid subpath import.
      {
        find: /^@cubone\/react-file-manager$/,
        replacement: resolve(
          reactFileManagerPackageRoot,
          'dist/react-file-manager.es.js',
        ),
      },
      {
        find: '@genarrative/image-canvas-core',
        replacement: resolve(
          repoRoot,
          'packages/image-canvas-core/src/index.ts',
        ),
      },
      {
        find: '@genarrative/image-canvas-react/styles.css',
        replacement: resolve(
          repoRoot,
          'packages/image-canvas-react/src/styles.css',
        ),
      },
      {
        find: '@genarrative/image-canvas-react',
        replacement: resolve(
          repoRoot,
          'packages/image-canvas-react/src/index.ts',
        ),
      },
      {
        find: '@genarrative/shared/styles.css',
        replacement: resolve(
          repoRoot,
          'packages/shared/src/components/styles.css',
        ),
      },
      {
        find: '@genarrative/shared/theme.css',
        replacement: resolve(repoRoot, 'packages/shared/src/theme.css'),
      },
      {
        find: '@genarrative/shared/components/ui',
        replacement: resolve(
          repoRoot,
          'packages/shared/src/components/ui/index.ts',
        ),
      },
      {
        find: '@genarrative/shared/lib',
        replacement: resolve(repoRoot, 'packages/shared/src/lib'),
      },
      {
        find: '@genarrative/shared/components/account',
        replacement: resolve(
          repoRoot,
          'packages/shared/src/components/account.ts',
        ),
      },
      {
        find: '@genarrative/shared/components',
        replacement: resolve(
          repoRoot,
          'packages/shared/src/components/index.ts',
        ),
      },
      {
        find: '@genarrative/shared',
        replacement: resolve(repoRoot, 'packages/shared/src/index.ts'),
      },
    ],
    dedupe: ['react', 'react-dom'],
  },
  server: {
    host: '127.0.0.1',
    port: 3080,
    strictPort: true,
    fs: {
      allow: [repoRoot],
    },
    proxy: {
      '/api': {
        target: apiTarget,
        changeOrigin: true,
      },
    },
  },
  build: {
    outDir: resolve(appRoot, 'dist'),
    emptyOutDir: true,
  },
});