mjml_email_template_to_responsive_html_compilation.ts

1import mjml2html from 'mjml';
2
3/*
4  Compile MJML to HTML
5*/
6const mjmlCode: string = `
7  <mjml>
8    <mj-body>
9      <mj-section>
10        <mj-column>
11          <mj-image width="100px" src="/assets/img/logo-small.png"></mj-image>
12          <mj-divider border-color="#F45E43"></mj-divider>
13          <mj-text font-size="20px" color="#F45E43" font-family="helvetica">Hello World</mj-text>
14        </mj-column>
15      </mj-section>
16    </mj-body>
17  </mjml>
18`;
19
20const htmlOutput = mjml2html(mjmlCode, {
21  beautify: true,
22  validationLevel: 'soft'
23});
24
25/*
26  The result contains:
27  - html: The rendered HTML string
28  - errors: An array of validation errors (if any)
29*/
30console.log(htmlOutput.html);