Product
Introducing Ruby Support in Socket
Socket is launching Ruby support for all users. Enhance your Rails projects with AI-powered security scans for vulnerabilities and supply chain threats. Now in Beta!
rollup-plugin-esbuild
Advanced tools
**💛 You can help the author become a full-time open-source maintainer by [sponsoring him on GitHub](https://github.com/sponsors/egoist).**
The rollup-plugin-esbuild package is a Rollup plugin that integrates esbuild, a fast JavaScript bundler and minifier, into the Rollup build process. It allows you to transpile TypeScript, JSX, and modern JavaScript syntax to older versions of JavaScript, as well as minify the output.
Transpile TypeScript
This feature allows you to transpile TypeScript files to JavaScript. The code sample demonstrates how to configure rollup-plugin-esbuild to process .ts files and output a CommonJS bundle.
const esbuild = require('rollup-plugin-esbuild');
module.exports = {
input: 'src/index.ts',
output: {
file: 'dist/bundle.js',
format: 'cjs'
},
plugins: [
esbuild({
include: /\.ts$/,
minify: false,
target: 'es2015'
})
]
};
Transpile JSX
This feature allows you to transpile JSX files to JavaScript. The code sample demonstrates how to configure rollup-plugin-esbuild to process .jsx files and output an ES module bundle.
const esbuild = require('rollup-plugin-esbuild');
module.exports = {
input: 'src/index.jsx',
output: {
file: 'dist/bundle.js',
format: 'esm'
},
plugins: [
esbuild({
include: /\.jsx$/,
minify: false,
target: 'es2015'
})
]
};
Minify JavaScript
This feature allows you to minify JavaScript files. The code sample demonstrates how to configure rollup-plugin-esbuild to minify the output and target ES2015.
const esbuild = require('rollup-plugin-esbuild');
module.exports = {
input: 'src/index.js',
output: {
file: 'dist/bundle.min.js',
format: 'iife'
},
plugins: [
esbuild({
minify: true,
target: 'es2015'
})
]
};
The rollup-plugin-terser package is a Rollup plugin that uses Terser to minify JavaScript. While rollup-plugin-esbuild can also minify JavaScript, rollup-plugin-terser is specifically focused on minification and offers more advanced minification options.
The rollup-plugin-babel package is a Rollup plugin that uses Babel to transpile JavaScript. It supports a wide range of JavaScript syntax transformations and plugins. Compared to rollup-plugin-esbuild, rollup-plugin-babel is more configurable and supports a broader range of transformations, but it is generally slower.
The rollup-plugin-sucrase package is a Rollup plugin that uses Sucrase to transpile modern JavaScript and TypeScript. Sucrase is designed to be faster than Babel for specific use cases, such as transpiling TypeScript and JSX. Compared to rollup-plugin-esbuild, rollup-plugin-sucrase is also focused on speed but supports fewer transformations.
💛 You can help the author become a full-time open-source maintainer by sponsoring him on GitHub.
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.
yarn add esbuild rollup-plugin-esbuild --dev
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'
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.jsxFactory
, jsxFragmentFactory
and target
options from your tsconfig.json
as default values.There are serveral ways to generate declaration file:
tsc
with emitDeclarationOnly
, the slowest way but you get type checking, it doesn't bundle the .d.ts
files.rollup-plugin-dts
which generates and bundle .d.ts
, also does type checking.api-extractor
by Microsoft, looks quite complex to me so I didn't try it, PR welcome to update this section.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',
}),
],
}
MIT © EGOIST (Kevin Titor)
FAQs
**💛 You can help the author become a full-time open-source maintainer by [sponsoring him on GitHub](https://github.com/sponsors/egoist).**
The npm package rollup-plugin-esbuild receives a total of 130,090 weekly downloads. As such, rollup-plugin-esbuild popularity was classified as popular.
We found that rollup-plugin-esbuild demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Socket is launching Ruby support for all users. Enhance your Rails projects with AI-powered security scans for vulnerabilities and supply chain threats. Now in Beta!
Product
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
Product
We're launching a new set of license analysis and compliance features for analyzing, managing, and complying with licenses across a range of supported languages and ecosystems.