Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/daankauwenberg/rollup-plugin-mjml
Compile MJML templates with Rollup
https://github.com/daankauwenberg/rollup-plugin-mjml
Last synced: 3 months ago
JSON representation
Compile MJML templates with Rollup
- Host: GitHub
- URL: https://github.com/daankauwenberg/rollup-plugin-mjml
- Owner: daankauwenberg
- License: isc
- Created: 2020-01-14T14:36:19.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-05T05:16:50.000Z (almost 2 years ago)
- Last Synced: 2024-05-14T20:18:10.138Z (6 months ago)
- Language: JavaScript
- Size: 1.07 MB
- Stars: 7
- Watchers: 2
- Forks: 0
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome - mjml - Convert MJML into responsive email templates. (Plugins / Other File Imports)
README
## Install
```bash
npm install rollup-plugin-mjml --save-dev
```
## Usage
Add `mjml()` to your `rollup.config.js` file.
```js
// 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:
```js
// main.js
import './mailtemplate.mjml'
```
#### Using @rollup/plugin-multi-entry
Alternatively, you can use Rollup's own plugin [multi-entry](https://github.com/rollup/plugins/tree/master/packages/multi-entry) to have multiple entry files and include them with something like `input: ['src/main.js', 'src/mail/**/*.mjml']`.
```js
// 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:
```js
// 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](https://github.com/isaacs/minimatch), 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](https://github.com/isaacs/minimatch), 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](https://mjml.io/documentation/#inside-node-js). 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](https://github.com/daankauwenberg/rollup-plugin-mjml/blob/master/LICENSE) for more information.