Skip to content
JSX email

CLI

Command Line Interface and developer tools for JSX-email

Install

Install the package from your command line

Terminal window
pnpm add jsx-email

Command Line Interface

The package provides an email CLI command that becomes available through package managers (pnpm exec, npx, or yarn). Here’s the basic command structure:

Terminal window
→ pnpm exec email


jsx-email v0.0.0


A CLI for working with Email Templates made with jsx-email


Usage
  $ email [...options]


Commands
  build       <template file or dir path>
  check       <template file path>
  create      <template name>
  help        [<command>]
  preview     <template dir path>


Options
  --help      Displays this message
  --version   Displays the current jsx-email version


Examples
  $ email
  $ email --help
  $ email build ./src/templates/Invite.tsx
  $ email create invite
  $ email preview ./src/templates

Available Commands

Build Command

Build and compile email templates to HTML format:

Terminal window
# Build entire directory
email build ./emails


# Build single template
email build ./emails/Welcome.tsx

Check Command

Verify email client compatibility using caniuse.com data:

Terminal window
email check ./emails/Welcome.tsx

Example output shows compatibility issues:

Terminal window
Checking email template for Client Compatibility...


Found 1 files:
   ./emails/Welcome.tsx


[...]


Check Complete: 14 error(s), 20 warning(s)

Preview Command

Launch a development server to preview your email templates with these features:

  • Fast and lightweight preview environment
  • Built-in support for monorepos
  • Local static asset serving
  • Hot-reloading

For a good example of how to handle local assets like images, please have a look at the demo AirBnB template. Notice that baseUrl is set using a condition on import.meta.isJsxEmailPreview. That import.meta property is specific to jsx-email and will be replaced appropriately at build time. Local assets are served from the templates root directory, in this case apps/demos/emails, at the server root. So a apps/demos/emails/batman.png file would be served at /batman.png in the browser. We recommend using a static or assets directory in your templates root directory, so it’s clear where files are being served from when viewing in the Preview Tool.

Launch the preview server:

Terminal window
email preview ./emails

Deploying Preview App

Create a deployable version of your preview environment:

Terminal window
email preview <templates-path> --build-path <build-path>

This generates a standalone app that can be deployed to any hosting platform.