gulp-esbuild

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.
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);

``js
const {createGulpEsbuild} = require('gulp-esbuild')
const gulpEsbuild = createGulpEsbuild({
incremental: true, // enables the esbuild's incremental build
})
`

$3

Esbuild doesn't fully support working with the virtual files which gulp send when you use: src(...).pipe(gulpEsbuild(...)).
We found workaround using some tricks, but one limitation still remains. Every file you send via src(...) must exist in the file system.
Its contents are not important, since they will be taken from the virtual file. But existence in the file system is required.

Installation


`bash
npm install gulp-esbuild esbuild
`
or
`bash
yarn add gulp-esbuild esbuild
`

Examples

$3

gulpfile.js
`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
`json
...
"scripts": {
"build": "gulp build"
}
...
`
command line
`bash
npm run build
`

$3

gulpfile.js
`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
`json
...
"scripts": {
"watch": "gulp watch"
}
...
`
command line
`bash
npm run watch
`

More examples here

Plugin arguments

| 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` | |