vite-plugin-wrapper

0.1.0 verified Mon Apr 27 auth: no javascript

A Vite plugin (v0.1.0) that enables transparent wrapping of matched modules with custom implementations. It intercepts module resolution and loading, allowing developers to replace module content while preserving the original module's identity. Designed for building higher-level Vite plugins and virtual module systems. It is a lightweight alternative to Rollup's `this.resolve` and virtual plugin patterns, providing a cleaner API for module wrapping. Requires Vite >=7. Ships TypeScript types.

Common errors

error Error: No matching export in 'vite-plugin-wrapper' for import 'wrapper' ↓

cause Using a default import instead of a named import.

fix

Change to import { wrapper } from 'vite-plugin-wrapper'

error TypeError: wrapper is not a function ↓

cause Possibly using default import if the named export is not called correctly.

fix

Ensure you use import { wrapper } from 'vite-plugin-wrapper' and call it as a function.

Warnings

breaking Requires Vite >=7. Do not use with older Vite versions. ↓

fix Upgrade Vite to version 7 or later.

gotcha The `load` function must return a string. Returning a Promise is not supported. ↓

fix Use `async load(id) { return '...'; }` if you need async, but ensure the final return is a string.

gotcha The filter `id` property only matches module IDs, not file paths. Use `filePath` for file system paths. ↓

fix If you need to match file paths, use `resolveId.filter.filePath` instead of `id`.

Install

npm install vite-plugin-wrapper

yarn add vite-plugin-wrapper

pnpm add vite-plugin-wrapper

Imports

wrapper

wrong

import wrapper from 'vite-plugin-wrapper'

correct

import { wrapper } from 'vite-plugin-wrapper'

Named export, not default. TypeScript types are bundled.

Quickstart

Wraps virtual:bar by adding a foo property to the exported object.

import { defineConfig } from 'vite';
import { wrapper } from 'vite-plugin-wrapper';

export default defineConfig({
  plugins: [
    wrapper({
      resolveId: {
        filter: { id: /^virtual:bar$/ },
      },
      load(id) {
        return `
import mod from ${JSON.stringify(id)};
export default { ...mod, foo: 'foo' };
`;
      },
    }),
  ],
});