Skip to main content

​
From MJML

  1. Remove the mjml npm package and install react-email and @react-email/components
  2. Find all MJML templates ending with the .mjml extension and convert these to React components with the .tsx or .jsx extension.
  3. Replace MJML standard component tags with React Email component tags where possible, including <Text>, <Img>, <Button> etc.
  4. Convert custom MJML components with the .js extension to React components with the .tsx or .jsx extension.
Try adding these other components to your email.

Image

Display an image in your email.

Link

A hyperlink to web pages or anything else a URL can address.

Divider

Display a divider that separates content areas in your email.

Preview

A preview text that will be displayed in the inbox of the recipient.
⌘I