Community plugins for esbuild

⚠️ These plugins are from the community and are not officially supported. ⚠️

This is just a centralized list of 3rd-party plugins to make discovery easier. No guarantees are made as to plugin quality, compatibility, or lack of malicious code. As with all 3rd-party dependencies, you should review them yourself before including them in your project.

Plugin list

New file extensions

@offen/esbuild-plugin-jsonschema: Compile and pack JSON schema definitions on import.
esbuild-coffeescript: A plugin to compile CoffeeScript files (*.coffee & *.litcoffee files).
esbuild-css-modules-plugin: A plugin to bundle xxx.modules.css or xxx.module.css into .js(x)/.ts(x). Can build with both bundle: true & bundle: false.
esbuild-graphql-loader: A plugin allowing for GraphQL file imports.
esbuild-mdx: A plugin to render .md and .mdx-delimited files as React components.
esbuild-plugin-css-modules: Another one plugin to support CSS-modules (partially)
esbuild-plugin-elm: A plugin to compile an elm project with esbuild.
esbuild-plugin-glsl: A plugin that adds support for GLSL file imports with optional shader minification.
esbuild-plugin-glslify: A plugin to to import GLSL strings with glslify (a node.js-style module system for GLSL).
esbuild-plugin-glslx: A plugin that supports *.glslx files including type checking of GLSL code.
esbuild-plugin-less: A plugin to transform LESS files to CSS files.
esbuild-plugin-markdown: Import & bundle markdown files
esbuild-plugin-postcss: A plugin to use postcss.
esbuild-plugin-postcss2: A plugin to use preprocessors and CSS modules with postcss.
esbuild-plugin-purescript: Adds support for importing PureScript code.
esbuild-plugin-sass: A plugin to transform SASS files to CSS files
esbuild-plugin-svg: A plugin to import SVG files.
esbuild-plugin-svgj: Import *.svg files as React components using svgj (~40x faster than svgr)
esbuild-plugin-svgr: A plugin to import *.svg files as React components.
esbuild-plugin-yaml: A plugin to load YAML files as ES6 modules.
esbuild-sass-plugin: Yet another SASS to CSS but with support for lit-element's styles
esbuild-stylus-loader: A plugin to transform stylus files to css files.
esbuild-svelte: A plugin to load and compile Svelte components.
esbuild-vue: A plugin to load and compile Vue 2 single-file components (*.vue files).
@espack/esbuild-sass-plugin: A sass plugin using dart sass with type definitions.
essass: A plugin to transform SASS files to CSS files.

Other plugins

@anatine/esbuild-decorators: This is a plugin for esbuild to handle the tsconfig setting "emitDecoratorMetadata": true using tsc to transpile .ts or .tsx files with decorators.
@fal-works/esbuild-plugin-global-externals: A plugin to replace module imports with global variables.
@yarnpkg/esbuild-plugin-pnp: A plugin adding support for Yarn Plug'n'Play installs.
decky: A plugin that makes TypeScript experimental decorators run at compile-time, enabling macros and potentially reducing bundle size
esbuild-plugin-alias: A plugin to resolve dynamic path aliases.
esbuild-plugin-babel: A plugin to compile files with Babel.
esbuild-plugin-browserify-adapter: An adapter to use existing Browserify transforms as esbuild plugins.
esbuild-plugin-browserslist: Configure esbuild targets based on a browserslist query.
esbuild-plugin-cache: A plugin to cache http/https modules. It works with import-maps.
esbuild-plugin-d.ts: ESBuild convenience plugin for compiling typescript definitions along with javascript
esbuild-plugin-filelastmodified: A plugin to replace fileLastModified with the actual time the file has been modified.
esbuild-plugin-flow: A plugin to strip types for Flow files using flow-remove-types package.
esbuild-plugin-globals: A plugin to replace module contents with user provided globals.
esbuild-plugin-ifdef A plugin that adds conditional code compilation for JavaScript/TypeScript using //#ifdef CONDITION comments.
esbuild-plugin-ignore: A plugin to ignore some certain dependencies from bundling.
esbuild-plugin-import-glob: A plugin to import multiple files using the glob syntax. Similar to require.context from webpack.
esbuild-plugin-inline-import: A plugin that inlines and optionally transforms imports with a configurable prefix.
esbuild-plugin-lodash: A plugin that helps tree-shake non-es lodash imports, similar to how babel-plugin-lodash works.
esbuild-plugin-manifest: A plugin to generate a hashed asset manifest file.
esbuild-plugin-pipe: A plugin to pipe the output of esbuild plugins.
esbuild-plugin-pnp: A plugin to support yarn 2 (berry) with PnP (Plug’n’Play).
esbuild-plugin-postcss-literal: A plugin to transform tagged template literals with PostCSS.
esbuild-plugin-stimulus: A plugin to automatically load Stimulus controllers from a folder.
esbuild-plugin-text-replace: Replace content before bundling with support for Filefilter, Namespace, Regex and Functions.
esbuild-plugin-tsc: A plugin to transform typescript files using the official typescript compiler. Allows usage of emitDecoratorMetadata.
esbuild-plugin-velcro: A plugin to load npm (bare module) dependencies from the cloud and requiring no previous npm install.
esbuild-plugin-webpack-bridge: A plugin that allows to use webpack loaders.
esbuild-svelte-paths: A plugin that resolves shortcuted pathes for Svelte components.

How to use a plugin

To use an esbuild plugin, you generally import it into your build script and then pass it to the esbuild API like this:

const esbuild = require('esbuild')
const somePlugin = require('some-plugin')

esbuild.build({
  plugins: [
    somePlugin(),
  ],
  ...
}).catch(() => process.exit(1))

More documentation about plugins and the plugin API is available here.

Adding your plugin here

If you would like to add your plugin to this list, create a PR that updates this README file. The update should add a single bullet under the Plugin list section that starts with a link to the plugin and is followed by a brief one-sentence description. The text of the link should be the npm package name and it should be inserted in alphabetical order. It should look something like this:

example-esbuild-plugin: A plugin to load *.example files.

Before creating a PR, please make sure that: