Compile

Compile jsx-email templates into a bundle

pnpm
aube
bun
npm
yarn
pnpm add jsx-email

Usage

import { readFile } from 'node:fs/promises;';
import { resolve } from 'node:path';

import { compile } from 'jsx-email/compile';

const templatePath = resolve(__dirname, './emails/Batman');
const outDir = resolve(__dirname, '.compiled');

const compiledFiles = await compile({ files: [templatePath], hashFiles: false, outDir });
Tips

Once compiled into a bundle, the file can be imported and passed to render such like:

import { render } from 'jsx-email';

import { Template } from './.compiled/batman.js';

const html = render(<Template />);

Note that whether or not to use a file extension in the import depends on your project’s settings. When using TypeScript you may have to adjust types to avoid errors, using this method.

Method Options

export interface Options {
  disableDefaultStyle?: boolean;
  inlineCss?: boolean;
  minify?: boolean;
  plainText?: boolean | PlainTextOptions;
  pretty?: boolean;
}

Options

files: string[];

An array of absolute paths for JSX/TSX template files to compile

hashFiles?: boolean;

Default: true. If true, adds the build hash to compiled file names. Set this to false if hashing and unique output filenames aren’t needed.

outDir: string;

An absolute path to output the compiled file(s)

writeMeta?: boolean;

If true, writes the ESBuild metadata for the compiled file(s)