esbuild-plugin-vue-next

0.1.4 verified Fri May 01 auth: no javascript deprecated

An esbuild plugin for compiling Vue 3.x Single File Components (SFC). Version 0.1.4 supports esbuild bundling with @vue/compiler-sfc (>=3.0.0). Provides options for template, script, and style compilation. Differentiators: integrates directly with esbuild's fast bundling pipeline, supports TypeScript types, and offers fine-grained control over Vue SFC compilation options. No maintainer activity since 2021; consider alternatives like @snowpack/plugin-vue or vite for active development.

Common errors

error Cannot find module 'esbuild-plugin-vue-next' ↓

cause Module not installed or import path incorrect.

fix

Run npm install esbuild-plugin-vue-next @vue/compiler-sfc.

error TypeError: pluginVue is not a function ↓

cause Imported named export instead of default export.

fix

Use import pluginVue from 'esbuild-plugin-vue-next' (default import).

error The requested module 'esbuild-plugin-vue-next' does not provide an export named 'pluginVue' ↓

cause Named import used but only default export exists.

fix

Use import pluginVue from 'esbuild-plugin-vue-next'.

error Cannot use import statement outside a module ↓

cause Running script as CommonJS without proper configuration.

fix

Add "type": "module" to package.json or use .mjs extension.

Warnings

deprecated No updates since 2021; consider using vite or @snowpack/plugin-vue for active development and Vue 3 compatibility. ↓

fix Migrate to a maintained alternative like vite or @snowpack/plugin-vue.

breaking Requires @vue/compiler-sfc >=3.0.0; incompatible with Vue 2. ↓

fix Use this plugin only with Vue 3 projects.

gotcha Default export is a function; CommonJS require may cause issues in some bundlers. ↓

fix Use ESM import or set esModuleInterop if using TypeScript with CommonJS.

gotcha Options types are exported but not runtime values; ensure tsconfig includes skipLibCheck if using isolatedModules. ↓

fix Use `import type { Options }` and set `skipLibCheck: false` or adjust compilerOptions.

Install

npm install esbuild-plugin-vue-next

yarn add esbuild-plugin-vue-next

pnpm add esbuild-plugin-vue-next

Imports

pluginVue

wrong

const pluginVue = require('esbuild-plugin-vue-next')

correct

import pluginVue from 'esbuild-plugin-vue-next'

The package only provides a default export; named import does not work.

Options

wrong

import { Options } from 'esbuild-plugin-vue-next'

correct

import type { Options } from 'esbuild-plugin-vue-next'

Options is exported as a TypeScript type, so use `import type` if using isolatedModules.

pluginVue

wrong

import { pluginVue } from 'esbuild-plugin-vue-next'

correct

import pluginVue from 'esbuild-plugin-vue-next'

The default export is a function; named export `pluginVue` does not exist.

Quickstart

Demonstrates bundling a Vue 3 app with esbuild using the plugin in ESM context.

import { build } from 'esbuild';
import pluginVue from 'esbuild-plugin-vue-next';
import { fileURLToPath } from 'url';

const __dirname = fileURLToPath(new URL('.', import.meta.url));

build({
  entryPoints: [__dirname + '/src/main.js'],
  bundle: true,
  outfile: __dirname + '/dist/bundle.js',
  plugins: [pluginVue()],
}).catch(() => process.exit(1));