nuǝɯ pǝɥsᴉꞁod mǝu

    TypeScript icon, indicating that this package has built-in type declarations

    2.0.1 • Public • Published

    MJML webpack loader

    npm npm GitHub Actions

    This webpack loader transforms your MJML files into html strings to be imported in nodejs. MJML is linked as peer dependency so you can use the version that you want.

    This is for webpack 5, for webpack 4 see v1.1.0


    Install the package as devDependency:

    yarn add -D webpack-mjml-loader

    Install MJML package as devDependency:

    yarn add -D mjml

    Update your webpack config:

    // webpack.config.js
    module.exports = {
      /* The rest of your webpack config */
      module: {
        rules: [
          /* Your other rules like babel-loader */
            test: /\.mjml$/,
            use: [
                loader: 'webpack-mjml-loader',
                options: { /* any mjml options */ minify: true } // optional, you can omit options

    Enjoy !

    import { default as foobarTemplate } from './foobar.mjml'
    sendEmail(foobarTemplate, { /* my options */ })

    Local Development

    This project was bootstrapped with TSDX.

    Below is a list of commands you will probably find useful.

    yarn start

    Runs the project in development/watch mode. Your project will be rebuilt upon changes. TSDX has a special logger for you convenience. Error messages are pretty printed and formatted for compatibility VS Code's Problems tab.

    yarn build

    Bundles the package to the dist folder. The package is optimized and bundled with Rollup into multiple formats (CommonJS, UMD, and ES Module).

    yarn test

    Runs the test watcher (Jest) in an interactive mode. By default, runs tests related to files changed since the last commit.


    npm i webpack-mjml-loader

    DownloadsWeekly Downloads






    Unpacked Size

    10.5 kB

    Total Files


    Last publish


    • vblitz