Vite

Under the hood, WXT uses Vite to bundle your web extension.

Basic Vite Configuration

All of Vite's config can be customized by setting the vite configuration in your wxt.config.ts file.

import { defineConfig } from 'wxt';

export default defineConfig({
  vite: () => ({
    // Same as `defineConfig({ ... })` inside vite.config.ts
  }),
});

Using Plugins

Plugins can be passed into the vite configuration in your wxt.config.ts file, just like any other option.

import { defineConfig } from 'wxt';

export default defineConfig({
  vite: () => ({
    plugins: [
      // ...
    ],
  }),
});

UNEXPECTED BEHAVIOR

Due to the way WXT orchestrates Vite builds, some plugins may not work as expected. Search GitHub issues if you run into issues with a specific plugin.

If one doesn't exist, please open a new issue!