{"id":21294,"library":"esbuild-svelte","title":"esbuild-svelte","description":"esbuild plugin that resolves and compiles .svelte files for bundling with esbuild. Current stable version 0.9.4, actively maintained. Supports Svelte 4 and 5 (peer dep range >=4.2.1 <6). Key differentiators: zero-config setup for CSS handling (external by default, can inject), built-in caching for incremental builds, and full support for Svelte preprocessors including TypeScript. Compared to alternatives like svelte-loader for webpack or vite-plugin-svelte, this plugin is tailored for esbuild's speed and simplicity, with minimal dependencies and straightforward API.","status":"active","version":"0.9.4","language":"javascript","source_language":"en","source_url":"https://github.com/EMH333/esbuild-svelte","tags":["javascript","svelte","esbuild","plugin","typescript"],"install":[{"cmd":"npm install esbuild-svelte","lang":"bash","label":"npm"},{"cmd":"yarn add esbuild-svelte","lang":"bash","label":"yarn"},{"cmd":"pnpm add esbuild-svelte","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency: required for plugin to function; esbuild >=0.17.0","package":"esbuild","optional":false},{"reason":"Peer dependency: required to compile .svelte files; Svelte >=4.2.1 <6","package":"svelte","optional":false}],"imports":[{"note":"ESM-only; CommonJS require will fail. Also, avoid importing from a subpath like 'esbuild-svelte/plugin'.","wrong":"const sveltePlugin = require('esbuild-svelte')","symbol":"default export (sveltePlugin)","correct":"import sveltePlugin from 'esbuild-svelte'"},{"note":"The plugin is a default export, not a named export. Named import will be undefined.","wrong":"import { sveltePlugin } from 'esbuild-svelte'","symbol":"sveltePlugin","correct":"import sveltePlugin from 'esbuild-svelte'"},{"note":"Use 'import type' for type-only imports to avoid runtime issues with ESM.","wrong":"import { SveltePluginOptions } from 'esbuild-svelte'","symbol":"SveltePluginOptions (TypeScript type)","correct":"import type { SveltePluginOptions } from 'esbuild-svelte'"}],"quickstart":{"code":"import esbuild from 'esbuild';\nimport sveltePlugin from 'esbuild-svelte';\n\nawait esbuild.build({\n  entryPoints: ['src/main.js'],\n  bundle: true,\n  outfile: 'dist/bundle.js',\n  plugins: [sveltePlugin()],\n  mainFields: ['svelte', 'browser', 'module', 'main'],\n  conditions: ['svelte', 'browser'],\n  logLevel: 'info',\n});","lang":"typescript","description":"Shows minimal esbuild build script with sveltePlugin, including required mainFields and conditions for Svelte component resolution."},"warnings":[{"fix":"Upgrade Svelte to >=4.2.1 and Node to >=18.","message":"Version 0.8.0 dropped support for Svelte 3 and Node <18.","severity":"breaking","affected_versions":">=0.8.0"},{"fix":"Set compilerOptions.css: 'external' to emit external CSS, or 'injected' to include in JS.","message":"The 'external' option in plugin options has been deprecated; use compilerOptions.css instead.","severity":"deprecated","affected_versions":">=0.8.0"},{"fix":"Add 'svelte' to conditions and 'svelte' to mainFields in esbuild build options.","message":"Missing 'svelte' in esbuild conditions or mainFields causes resolution failures for Svelte component libraries.","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Use a separate dev server like sirv and configure esbuild in watch mode, or consider vite-plugin-svelte for dev experience.","message":"Plugin does not handle HMR or dev server; it's a compile-only plugin.","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Explicitly set compilerOptions.css if default behavior matters.","message":"In version 0.7.0, the default CSS handling changed from 'injected' to 'external'.","severity":"breaking","affected_versions":">=0.7.0 <0.8.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Change to: import sveltePlugin from 'esbuild-svelte';","cause":"Incorrect named import instead of default import.","error":"Error: No matching export in 'esbuild-svelte' for import 'sveltePlugin'"},{"fix":"Use ESM import or use require('esbuild-svelte').default.","cause":"Using CommonJS require which returns a module object instead of the default export.","error":"TypeError: sveltePlugin is not a function"},{"fix":"Run 'npm install esbuild-svelte' and ensure Node >=18.","cause":"Missing dependency or incorrect Node version (<18).","error":"Cannot find module 'esbuild-svelte'"},{"fix":"Run 'npm install svelte@^4.2.1'.","cause":"Missing or outdated peer dependency svelte.","error":"Error: The 'svelte' package must be installed and version >=4.2.1"},{"fix":"Remove vite-plugin-svelte from plugins array when using esbuild-svelte.","cause":"Conflicting plugins; both handle .svelte files.","error":"Error: '@sveltejs/vite-plugin-svelte' is not compatible with esbuild-svelte"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}