@wxt-dev/module-vue

Enables the use of Vue in your web extension, in HTML pages and content scripts.

This plugin makes a few changes:

1. Adds @vitejs/plugin-vue to vite config
2. Adds the vue preset to auto-imports
3. Applies sourcemap fix to prevent HMR errors during development
4. Enable auto-imports in .vue files

Usage

pnpm i vue
pnpm i -D @wxt-dev/module-vue

Then add the module to your config:

// wxt.config.ts
export default defineConfig({
  // Required
  modules: ['@wxt-dev/module-vue'],

  // Optional: Pass options to the module:
  vue: {
    vite: {
      script: {
        propsDestructure: true,
      },
    },
  },
});