/rollup-plugin-esbuild

Use ESBuild with Rollup to transform ESNext and TypeScript code.

Primary LanguageTypeScriptMIT LicenseMIT

💛 You can help the author become a full-time open-source maintainer by sponsoring him on GitHub.


rollup-plugin-esbuild

npm version npm downloads

esbuild is by far one of the fastest TS/ESNext to ES6 compilers and minifier, this plugin replaces rollup-plugin-typescript2, @rollup/plugin-typescript and rollup-plugin-terser for you.

Install

yarn add esbuild rollup-plugin-esbuild --dev

Usage

In rollup.config.js:

import esbuild from 'rollup-plugin-esbuild'

export default {
  plugins: [
    esbuild({
      // All options are optional
      include: /\.[jt]sx?$/, // default, inferred from `loaders` option
      exclude: /node_modules/, // default
      sourceMap: false, // default
      minify: process.env.NODE_ENV === 'production',
      target: 'es2017', // default, or 'es20XX', 'esnext'
      jsx: 'transform', // default, or 'preserve'
      jsxFactory: 'React.createElement',
      jsxFragment: 'React.Fragment',
      // Like @rollup/plugin-replace
      define: {
        __VERSION__: '"x.y.z"',
      },
      tsconfig: 'tsconfig.json', // default
      // Add extra loaders
      loaders: {
        // Add .json files support
        // require @rollup/plugin-commonjs
        '.json': 'json',
        // Enable JSX in .js files too
        '.js': 'jsx',
      },
    }),
  ],
}
  • include and exclude can be String | RegExp | Array[...String|RegExp], when supplied it will override default values.
  • It uses jsxFactory, jsxFragmentFactory and target options from your tsconfig.json as default values.

Declaration File

There are serveral ways to generate declaration file:

  • Use tsc with emitDeclarationOnly, the slowest way but you get type checking, it doesn't bundle the .d.ts files.
  • Use rollup-plugin-dts which generates and bundle .d.ts, also does type checking.
  • Use api-extractor by Microsoft, looks quite complex to me so I didn't try it, PR welcome to update this section.

Use with Vue JSX

Use this with rollup-plugin-vue-jsx:

import vueJsx from 'rollup-plugin-vue-jsx-compat'
import esbuild from 'rollup-plugin-esbuild'

export default {
  // ...
  plugins: [
    vueJsx(),
    esbuild({
      jsxFactory: 'vueJsxCompat',
    }),
  ],
}

Bundle mode

This plugin also includes an experimental bundle mode which lets rollup resolve, load, and transform imported files but leaves bundling to esbuild. In my simple test it's around 50% faster than non-bundle mode, but still 10x slower than raw esbuild.

To enable this mode, passing experimentalBundling: true to the options.

Current limitation: no code splitting yet.

License

MIT © EGOIST (Kevin Titor)