decorate-vite-plugin

0.1.0 verified Mon Apr 27 auth: no javascript

A utility library for decorating Vite plugins by enhancing their hook functions without modifying the original plugin code. Version 0.1.0 supports Vite >= v3. Ships TypeScript types. Key differentiator: provides a non-invasive way to wrap Vite plugin hooks (e.g., transform, resolveId) with custom logic, useful for logging, caching, or modifying behavior. Lightweight with minimal bundle size. Community-maintained with MIT license.

Common errors

error TypeError: Cannot read properties of undefined (reading 'transform') ↓

cause Decorated hook name is not present on the plugin (e.g., plugin has no transform hook).

fix

Check plugin's available hooks; only existing hooks can be decorated.

error Error: [vite] The decorator must be a function ↓

cause The decorator argument is not a function.

fix

Pass a function as the decorator: (original, plugin) => { ... }.

error TypeError: originalTransform.call is not a function ↓

cause originalTransform is undefined or the hook does not exist.

fix

Ensure the hook exists on the plugin; if optional, check for undefined before calling.

Warnings

gotcha The decorator function must preserve the `this` context of the original hook. Use `.call(plugin, ...)` to bind correctly. ↓

fix Always call original hook with plugin context: `originalHook.call(plugin, ...args)`.

gotcha decorateVitePluginOption may return a different plugin identity, which can affect plugin ordering if compared by reference. ↓

fix Do not rely on reference equality of plugins after decoration.

gotcha Only works with Vite >= v3. Using with older versions will cause runtime errors due to missing Plugin type fields. ↓

fix Ensure Vite version is 3 or higher.

gotcha The package does not export default; using `import decorate from 'decorate-vite-plugin'` will result in undefined. ↓

fix Use named imports: `import { decoratePlugin } from 'decorate-vite-plugin'`.

Install

npm install decorate-vite-plugin

yarn add decorate-vite-plugin

pnpm add decorate-vite-plugin

Imports

decoratePlugin
```
import { decoratePlugin } from 'decorate-vite-plugin'
```
Named export; decoratePlugin decorates a single plugin's hook.
decorateVitePluginOption
```
import { decorateVitePluginOption } from 'decorate-vite-plugin'
```
Named export; handles any PluginOption type (array, promise, etc.).

default export

wrong

const decorate = require('decorate-vite-plugin')

correct

import decorate from 'decorate-vite-plugin'

No default export; CJS require will not work. Use named imports only.

Quickstart

Decorates the transform hook of @vitejs/plugin-vue with logging.

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import { decorateVitePluginOption } from 'decorate-vite-plugin';

export default defineConfig({
  plugins: [
    decorateVitePluginOption(
      vue(),
      'transform',
      (originalTransform, plugin) => {
        return function (code, id) {
          console.log(`Transforming ${id}`);
          return originalTransform?.call(plugin, code, id);
        };
      },
    ),
  ],
});