A gulp plugin for the esbuild bundler.
There are two exports available: gulpEsbuild
and createGulpEsbuild
. In most cases you should use the gulpEsbuild
export. Use the createGuipEsbuild
export if you want to enable the esbuild's incremental build or piping:
- the esbuild's incremental build is used with the gulp's watching files API and allows you to rebuild only changed parts of code (example);
- piping allows you to receive data from other plugins via stream piping (example).
const {createGulpEsbuild} = require('gulp-esbuild')
const gulpEsbuild = createGulpEsbuild({
incremental: true, // enables the esbuild's incremental build
piping: true, // enables piping
})
Notice: ⚠️ piping is disabled by default ⚠️
npm install gulp-esbuild
or
yarn add gulp-esbuild
gulpfile.js
const {
src,
dest,
} = require('gulp')
const gulpEsbuild = require('gulp-esbuild')
function build() {
return src('./index.tsx')
.pipe(gulpEsbuild({
outfile: 'bundle.js',
bundle: true,
loader: {
'.tsx': 'tsx',
},
}))
.pipe(dest('./dist'))
}
exports.build = build
package.json
...
"scripts": {
"build": "gulp build"
}
...
command line
npm run build
gulpfile.js
const {
src,
dest,
watch,
} = require('gulp')
const {createGulpEsbuild} = require('gulp-esbuild')
const gulpEsbuild = createGulpEsbuild({ incremental: true })
function build() {
return src('./src/index.js')
.pipe(gulpEsbuild({
outfile: 'outfile.js',
bundle: true,
}))
.pipe(dest('./dist'))
}
function watchTask() {
watch('./src/index.js', build)
}
exports.watch = watchTask
package.json
...
"scripts": {
"watch": "gulp watch"
}
...
command line
npm run watch
More examples here
Name | Type | Default |
---|---|---|
sourcemap | boolean|'linked'|'inline'|'external'|'both' |
|
sourceRoot | string |
|
sourcesContent | boolean |
|
legalComments | 'none'|'inline'|'eof'|'linked'|'external' |
|
format | 'iife'|'cjs'|'esm' |
|
globalName | string |
|
target | string |
|
supported | object |
|
mangleProps | RegExp |
|
reserveProps | RegExp |
|
mangleQuoted | boolean |
|
mangleCache | object |
|
drop | 'console'|'debugger' |
|
dropLabels | array |
|
minify | boolean |
|
minifyWhitespace | boolean |
|
minifyIdentifiers | boolean |
|
minifySyntax | boolean |
|
lineLimit | number |
|
charset | 'ascii'|'utf8' |
|
treeShaking | boolean |
|
ignoreAnnotations | boolean |
|
jsx | 'transform'|'preserve'|'automatic' |
|
jsxFactory | string |
|
jsxFragment | string |
|
jsxImportSource | string |
|
jsxDev | boolean |
|
jsxSideEffects | boolean |
|
define | object |
|
pure | array |
|
keepNames | boolean |
|
banner | object |
|
footer | object |
|
color | boolean |
|
logLevel | 'verbose'|'debug'|'info'|'warning'|'error'|'silent' |
'silent' |
logLimit | number |
|
logOverride | object |
|
tsconfigRaw |
string |object
|
|
bundle | boolean |
|
splitting | boolean |
|
preserveSymlinks | boolean |
|
outfile | string |
|
metafile | boolean |
|
metafileName | string |
'metafile.json' |
outdir | string |
|
outbase | string |
|
platform | 'browser'|'node'|'neutral' |
|
external | array |
|
packages | 'external' |
|
alias | object |
|
loader | object |
|
resolveExtensions | array |
|
mainFields | array |
|
conditions | array |
|
tsconfig | string |
|
outExtension | object |
|
publicPath | string |
|
entryNames | string |
|
chunkNames | string |
|
assetNames | string |
|
inject | array |
|
plugins | array |