This plugin will generate a manifest.json file, mapping original asset names to their corresponding output name.
npm install --save-dev esbuild esbuild-plugin-manifestCreate file build.js:
const esbuild = require('esbuild');
const manifestPlugin = require('esbuild-plugin-manifest')
esbuild.build({
entryPoints: ['src/index.js'],
bundle: true,
outdir: 'output/',
plugins: [manifestPlugin()],
}).catch((e) => console.error(e.message))This will generate a manifest.json in the output directory with a mapping of all the unhashed filenames to their corresponding hashed output filename:
{
"output/index.js": "output/index-4QTUNIID.js"
}Type: Boolean
Default: true
By default we assume that you want to hash the output files. We use [dir]/[name]-[hash] as the default hash format. You can disable hashing by setting this to false or you can set your own hash format by directly using esbuild's entryNames option.
Type: Boolean | 'input' | 'output'
Default: false
By default we will use the full input and output paths {"output/index.js":"output/index-4QTUNIID.js"}, but when this option is enabled it will use the basename of the files {"index.js":"index-4QTUNIID.js"}
Type: Boolean | 'input' | 'output'
Default: false
We'll keep all file extensions by default, but you can specify true to remove them from both or one of 'input' or 'output' to only remove them from the input or output respectively. Eg: specifying manifestPlugin({ extensionless: 'input' }) will result in {"output/index":"output/index-4QTUNIID.js"}
Type: String
Default: manifest.json
The name of the generated manifest file in the output directory.
Type: Function
Default: undefined
A custom Function to create the manifest. The passed function should match the signature of (entries: {[key: string]: string}) => Object; and can return anything as long as it's serialisable by JSON.stringify.
Type: Function
Default: undefined
Allows filtering the files which make up the manifest. The passed function should match the signature of (filename: string) => boolean. Return true to keep the file, false to remove the file.
Type: Boolean
Default: false
By default, we use the same extension of the output file as the keys of the manifest key entry. Use this option if you'd rather use the input file (entrypoint) as the manifest key instead.
Type: Boolean
Default: false
By default, we will overwrite the manifest file if it already exists. This option will append to the existing manifest file instead and only overwrite the entries that have changed.
// build.js
const esbuild = require('esbuild');
const manifestPlugin = require('esbuild-plugin-manifest');
esbuild.build({
entryPoints: ['src/index.ts'],
bundle: true,
outdir: 'output/',
plugins: [manifestPlugin()],
}).catch((e) => console.error(e.message))// manifest.json
{
"output/index.js": "output/index-4QTUNIID.js"
}// build.js
const esbuild = require('esbuild');
const manifestPlugin = require('esbuild-plugin-manifest');
esbuild.build({
entryPoints: ['src/index.ts'],
bundle: true,
outdir: 'output/',
plugins: [manifestPlugin({useEntrypointKeys: true})],
}).catch((e) => console.error(e.message))// manifest.json
{
"src/index.ts": "output/index-4QTUNIID.js"
}To generate multiple files from the same entrypoint with esbuild, you need to run it multiple times. Utilize esbuilds outExtension option along with our append option to generate multiple files from the same entrypoint.
// build.js
import * as esbuild from 'esbuild'
import manifestPlugin from 'esbuild-plugin-manifest'
await esbuild.build({
entryPoints: ['src/index.js'],
bundle: true,
outdir: 'output/',
format: 'cjs',
plugins: [manifestPlugin()],
}).catch((e) => console.error(e.message))
await esbuild.build({
entryPoints: ['src/index.js'],
bundle: true,
outdir: 'output/',
format: 'esm',
outExtension: { '.js': '.mjs' },
plugins: [manifestPlugin({ append: true })],
}).catch((e) => console.error(e.message))// manifest.json
{
"output/index.js": "output/index-4QTUNIID.js",
"output/index.mjs": "output/index-5RUVOJJE.mjs"
}To generate a manifest with subresource integrity hashes, you can use the generate option to create a manifest with the hashes.
// build.js
const esbuild = require('esbuild');
const manifestPlugin = require('esbuild-plugin-manifest');
const {createHash} = require('crypto');
esbuild.build({
entryPoints: ['src/index.js'],
bundle: true,
outdir: 'output/',
plugins: [manifestPlugin({
// The `entries` object is what the contents of the manifest would normally be without using a custom `generate` function.
// It is a string to string mapping of the original asset name to the output file name.
generate: (entries) => {
const manifest = {};
for (const [source, file] of Object.entries(entries)) {
manifest[source] = {
// `file` and `integrity` are arbitrary names and can be anything you want.
file: file,
integrity: "sha384-" + createHash('sha384').update(file).digest('base64'),
};
}
return manifest;
},
})],
}).catch((e) => console.error(e.message))// manifest.json
{
"output/index.js": {
"file": "output/index-4QTUNIID.js",
"integrity": "sha384-<hash>",
}
}