bun-as-vite ⚡

Run Vite-configured web applications on Bun natively with zero config rewrite.

bun-as-vite is a drop-in replacement for Vite's defineConfig. It lets you keep your standard Vite project structure, plugin definitions, and configuration format, while driving Bun.build and Bun.serve under the hood for 10x faster builds and instant dev startup.

Features

• ⚡ Zero-Rewrite defineConfig: Use standard Vite configuration options (root, server.proxy, resolve.alias, build, define, plugins).
• 🔄 Native Bun Dev Server with HMR: Built-in WebSocket Hot Module Replacement with automatic fallback.
• 🚀 Full Bun.build Integration: Supports synthetic code-splitting, custom chunk naming, and direct passthrough of any extra Bun.build options from defineConfig.
• 🌐 Vite-Standard Proxy: Supports string shorthand, options objects with rewrite(), changeOrigin, and RegExp path matching.
• ⚛️ Universal React Support: Out-of-the-box support for React 17, 18, and 19, including native and fallback React Compiler runtimes (react/compiler-runtime & react-compiler-runtime).
• 🎨 Tailwind CSS v4 & JIT: Automatic CSS URL rewriting and composable CSS transformation pipeline.
• 📦 First-Class Plugin System: Hook-driven plugin lifecycle (configBun, cssTransform, buildComplete, serverRequest).

Installation

bun add -d bun-as-vite
# or
npm install -D bun-as-vite

Quick Start

1. Create bun.config.js (or bun.config.ts)

import { defineConfig } from 'bun-as-vite';
import {
  tailwindcss,
  codeSplitPlugin,
  proxyRedirectsPlugin,
  customConfigPlugin,
  envLoaderPlugin,
  buildScorerPlugin,
} from 'bun-as-vite/plugins';

const config = defineConfig(() => ({
  plugins: [
    tailwindcss(),
    customConfigPlugin({ alias: { '@': 'src/@' } }),
    codeSplitPlugin({
      groups: [
        { name: 'vendor-charts', test: /[\/\\]node_modules[\/\\](chart\.js|recharts)[\/\\]/ },
        { name: 'vendor-ui', test: /[\/\\]node_modules[\/\\](@carbon|carbon-components)[\/\\]/ },
      ],
    }),
    proxyRedirectsPlugin(),
    envLoaderPlugin(),
    buildScorerPlugin(),
  ],
  server: {
    port: 4545,
    proxy: {
      '/api': {
        target: 'https://api.example.com',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ''),
      },
    },
  },
  define: {
    global: 'globalThis',
  },
}));

export default config;

// Optional: Run directly with `bun bun.config.js --dev`
await config.run();

2. Add Scripts to package.json

{
  "scripts": {
    "dev:bun": "bun bun.config.js --dev",
    "build:bun": "bun bun.config.js --build",
    "serve:bun": "bun bun.config.js --preview"
  }
}

Or run via the CLI binary:

bun-as-vite dev
bun-as-vite build
bun-as-vite preview

Extra Bun.build Options

Any extra properties not recognized as Vite core options are automatically forwarded and spread directly to Bun.build:

export default defineConfig(() => ({
  // Top-level Bun.build options:
  packages: 'bundle',
  format: 'esm',
  external: ['some-external-package'],

  // Or inside build:
  build: {
    outDir: 'dist',
    drop: ['console', 'debugger'],
  },

  // Or explicitly in a bun / bunBuild block:
  bunBuild: {
    banner: '/* Generated by bun-as-vite */',
  },
}));

Universal React Compiler Support

bun-as-vite automatically detects and bridges React Compiler runtimes across versions:

• React 19: Resolves react/compiler-runtime to React 19's native runtime.
• React 17 & 18: Resolves react/compiler-runtime to the react-compiler-runtime package.
• Zero-Dependency Fallback: Injects an in-memory virtual shim if neither package is present so your build never breaks.

Included Plugins

| Plugin | Description | |---|---| | codeSplitPlugin({ groups }) | Synthetic code-splitting for Bun.build with custom vendor chunks. | | proxyRedirectsPlugin({ proxy, templateFile }) | Netlify-style redirects or standard Vite proxy configurations. | | customConfigPlugin({ alias }) | Path aliases and directory mapping. | | envLoaderPlugin({ prefixes }) | Extra environment variable prefixes for import.meta.env. | | buildScorerPlugin() | Terminal bundle size audit and oversized chunk warning report. | | tailwindcss() | Tailwind CSS v4 JIT compilation hook. | | wrapPlugin(plugin) | Wraps third-party Vite plugins for safe execution under Bun. |

License

MIT © Yathin