🍣 A Rollup plugin to mix CommonJS exports.
So, the consumers of your bundle will not have to use chunk .default
to access their default export.
Your source code might be like this:
export let amount = 0
export const increaseAmount = () => {
amount = amount + 1
}
export const named = () => {
console.log('named')
}
export default () => {
console.log('default')
}
Then, consumers could import it like this:
import index, { named, increaseAmount } from 'your-module-name'
index() // will print: 'default'
named() // will print: 'named'
index.default() // will print: 'default'
console.log(index.amount) // will print: 0
increaseAmount()
console.log(index.amount) // will print: 1
Or, they could use CommonJS syntax:
const index = require('your-module-name')
const { named, increaseAmount } = require('your-module-name')
index() // will print: 'default'
named() // will print: 'named'
index.default() // will print: 'default'
console.log(index.amount) // will print: 0
increaseAmount()
console.log(index.amount) // will print: 1
By default, Rollup keeps named and default exports separate, requiring consumers to use .default
to access default exports. This plugin simplifies the consumer experience by merging them.
This plugin requires:
✅ LTS Node version (v14.21.3+),
✅ Rollup (v4.24.0+),
✅ ESBuild plugin (v6.1.1+)
npm i -D rollup-plugin-esbuild @mnrendra/rollup-plugin-mixexport
For ES modules (rollup.config.mjs
):
import esbuild from 'rollup-plugin-esbuild' // 'rollup-plugin-esbuild' is required
import mixexport from '@mnrendra/rollup-plugin-mixexport'
export default [
{
external: (id) => !/^[./]/.test(id),
input: 'your_input_file.(js|cjs|mjs|jsx|ts|cts|mts|tsx)',
output: [
{
file: 'dist/your_output_file.js',
format: 'cjs',
sourcemap: true
}
],
plugins: [
esbuild({ minify: true }), // <-- need `esbuild` to be executed immediately before `mixexport`
mixexport({ minify: true }) // <-- execute `mixexport` immediately after `esbuild`
],
onwarn ({ code }) {
if (code === 'MIXED_EXPORTS') return false // to disable Rollup's 'MIXED_EXPORTS' warning log
}
}
]
For CommonJS (rollup.config.js
):
const esbuild = require('rollup-plugin-esbuild') // 'rollup-plugin-esbuild' is required
const mixexport = require('@mnrendra/rollup-plugin-mixexport')
module.exports = [
{
external: (id) => !/^[./]/.test(id),
input: 'your_input_file.(js|cjs|mjs|jsx|ts|cts|mts|tsx)',
output: [
{
file: 'dist/your_output_file.js',
format: 'cjs',
sourcemap: true
}
],
plugins: [
esbuild({ minify: true }), // <-- need `esbuild` to be executed immediately before `mixexport`
mixexport({ minify: true }) // <-- execute `mixexport` immediately after `esbuild`
],
onwarn ({ code }) {
if (code === 'MIXED_EXPORTS') return false // to disable Rollup's 'MIXED_EXPORTS' warning log
}
}
]
const mixexport = require('@mnrendra/rollup-plugin-mixexport')
module.exports = [
{
plugins: [
mixexport({
minify: true, // To produce the minified or pretty format.
defineEsModule: true // To specify whether to define `exports.__esModule`.
})
]
}
]
To produce the minified or pretty format.
type: boolean
default: false
To specify whether to define exports.__esModule
.
type: boolean|undefined
default: undefined