https://github.com/clebert/esbuild-html-plugin
An esbuild plugin that generates an HTML file.
https://github.com/clebert/esbuild-html-plugin
Last synced: 10 months ago
JSON representation
An esbuild plugin that generates an HTML file.
- Host: GitHub
- URL: https://github.com/clebert/esbuild-html-plugin
- Owner: clebert
- License: mit
- Created: 2023-05-30T19:01:48.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-07-16T15:45:00.000Z (almost 2 years ago)
- Last Synced: 2025-09-01T21:43:13.681Z (10 months ago)
- Language: TypeScript
- Homepage:
- Size: 217 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# esbuild-html-plugin
> An esbuild plugin that generates an HTML file.
This esbuild plugin allows the creation of an HTML file featuring output URLs of bundled assets,
while supporting customization of head and body elements.
## Installation
```
npm install esbuild-html-plugin
```
## Usage Example
```js
import * as esbuild from 'esbuild';
await esbuild.build({
entryPoints: [`app.ts`],
bundle: true,
outdir: `dist`,
publicPath: `/static`,
plugins: [
htmlPlugin({
outfile: `index.html`,
createHeadElements: () => [
``,
``,
`Example`,
],
createBodyElements: (outputUrls) =>
outputUrls
.filter((outputUrl) => outputUrl.endsWith(`.js`))
.map((outputUrl) => ``),
}),
],
});
```
## Options
### `outfile` (required)
The output file's name for the generated HTML. This name will be combined with the `outdir` or the
dirname of the `outfile` from the esbuild options.
```
{
outfile: `index.html`,
}
```
### `language` (optional)
The language attribute for the HTML tag.
```
{
language: `en`,
}
```
### `createHeadElements` (optional)
A function that receives the output URLs of the bundled assets and returns an array of strings
representing the custom head elements.
```
{
createHeadElements: (outputUrls) =>
outputUrls
.filter((outputUrl) => outputUrl.endsWith(`.css`))
.map((outputUrl) => ``),
}
```
### `createBodyElements` (optional)
A function that receives the output URLs of the bundled assets and returns an array of strings
representing the custom body elements.
```
{
createBodyElements: (outputUrls) =>
outputUrls
.filter((outputUrl) => outputUrl.endsWith(`.js`))
.map((outputUrl) => ``),
}
```