Install

npm install rollup-plugin-mjml --save-dev

Usage

Add mjml() to your rollup.config.js file.

// rollup.config.js
import mjml from 'rollup-plugin-mjml';

export default {
  //...
  plugins: [
    mjml()
  ]
}

After configuring you need to include the .mjml template files in your bundle. You can use either option:

Importing in JS

Easiest withouth extra dependencies is to import the templates in your Javascript:

// main.js
import './mailtemplate.mjml'

Using @rollup/plugin-multi-entry

Alternatively, you can use Rollup's own plugin multi-entry to have multiple entry files and include them with something like input: ['src/main.js', 'src/mail/**/*.mjml'].

// rollup.config.js
import multi from '@rollup/plugin-multi-entry';
import mjml from 'rollup-plugin-mjml';

export default {
  input: ['src/main.js', 'src/mail/**/*.mjml'],
  //...
  plugins: [multi(), mjml()],
}

Options

Options can be added as parameter to the plugin, for example:

// rollup.config.js
export default {
  //...
  plugins: [
    mjml({
      outputDir: 'dist/mail',
      validationLevel: 'strict',
    })
  ]
}

outputDir

Type: String
Default: Same location as where the bundle is exported

A relative path from where Rollup is initiated, e.g. dist/email.

outputExt

Type: String
Default: html

The extension can be changed to fit needs e.g. twig. This only changes the filename, no other rendering is done. Language specific logic could be placed in mj-raw tags.

exclude

Type: String | Array[...String]
Default: null

A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should ignore. By default no files are ignored.

include

Type: String | Array[...String]
Default: null

A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should operate on. By default all files are targeted.

MJML Options

Additionally the MJML options can be added to the top level of the options object. More information can be found in the MJML Documentation. In short, following options can be added:

• fonts
• keepComments
• beautify
• minify
• validationLevel
• filePath
• mjmlConfigPath
• minifyOptions
• juicePreserveTags

License

The ISC License (ISC). Please see License File for more information.