parcel-plugin-mjml
v1.0.0
Published
Parcel plugin to handle mjml-templates as html
Downloads
9
Readme
Parcel plugin for MJML
A parcel-plugin to enable the use of
mjml-templates in your project.
Usage
After you installed the plugin parcel will use it
automatically on any file ending with .mjml.
You could either use an mjml-template as the entry point:
parcel src/template.mjmlOr you could use it as a dependency in another file, e.g. a standard
html-file:
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>App</title>
</head>
<body>
<a href="./template.mjml">See my awesome mjml template</a>
</body>
</html>Importing dependencies inside your templates
mjml has its own module system
where you can include other templates, or components into your base template,
and this will work as expected with this plugin:
<mj-include path="./includes/button.mjml" />If you want to include css (or javascript – even though that would probably not
work very well in an email) you have to wrap the import in <mj-raw>:
<mj-head>
<mj-raw>
<link rel="stylesheet" href="./app.scss" />
</mj-raw>
</mj-head>But for the css to work better in html I recommend that you also use something
like parcel-plugin-inliner to
inline the css into your generated html.
Installation
npm i -D parcel-plugin-mjml
# or
yarn add --dev parcel-plugin-mjmlAny module named parcel-plugin-* present in your package.json will be used
automatically by Parcel. So after the installation step you are good to go.
Configuration
mjml can, to some extent, be configured using an .mjmlconfig file located in
the root of you project.
Read more in the mjml documentation.
License
MIT (c) Adam Bergman 2019