• email-templates 集成mjml 的另外一个方法


    今天有写过一个简单的email-templates 集成mjml 的方法,是通过自定义render(扩展性比较灵活)实际上
    email-templates 也提供了配置选项,我们可以选择自己的方法进行模版引擎的扩展,以下是一个简单的尝试

    环境准备

    • 项目结构
     
    ├── README.md
    ├── app.js
    ├── emails
    └── templates
    ├── html.mjml
    ├── subject.mjml
    └── text.mjml
    ├── package.json
    ├── polyfill.js
    └── yarn.lock
    • 代码说明
      package.json 依赖的包以及npm script 定义
    {
      "name": "email-template-learning",
      "version": "1.0.0",
      "main": "app.js",
      "license": "MIT",
      "dependencies": {
        "email-templates": "^6.1.1",
        "mjml": "^4.5.1",
        "nodemailer": "^6.4.2",
        "pug": "^2.0.4"
      },
      "scripts": {
        "app": "node app.js"
      }
    }

    polyfill.js string 支持插值的,方便变量引入,比较简单

    String.prototype.interpolate = function(params) {
        const names = Object.keys(params);
        const vals = Object.values(params);
        return new Function(...names, `return \`${this}\`;`)(...vals);
    }
    module.exports = String.prototype.interpolate

    app.js 核心代码,后边会有介绍

    const Email = require('email-templates');
    const mjml2html = require("mjml")
    const fs = require("fs")
    /**
     * customer render functions for mjml
     * @param {mjml content string} mjmlcontent 
     */
    function mjml(mjmlpath,locals,cb) {
      let mjmlContent = mjml2html(fs.readFileSync(mjmlpath).toString());
      cb(null,mjmlContent.html)
    }
    const nodemailer = require("nodemailer")
    require("./polyfill")
    const realtransporter = nodemailer.createTransport({
      port: 587,
      host: "<smtp host>",
      auth: {
        type: "LOGIN",
        user: "<email accounts>",
        pass: "<email password>"
      }
    })
    const email = new Email({
      message: {
        from: '<email accounts>'
      },
      views: {
        options: {
          extension: 'mjml', // for mjml 
          map: {
            mjml: 'mjml',
          },
          engineSource: {
            mjml:mjml
          }
        }
      },
      send: true,
      transport: realtransporter
    }
    );
    email
      .send({
        template: 'templates',
        message: {
          to: '1141591465@qq.com',
          subject: "demoapp"
        },
        locals: {
          name: 'Elon'
        }
      })
      .then(console.log)
      .catch(console.error);
     

    模版内容,内容在emails, 目录结构如下,内容就是实际的mjml 标签

    emails
    └── templates
        ├── html.mjml
        ├── subject.mjml
        └── text.mjml
    • 自定义模版引擎的核心说明
      对于自定义模版引擎是通过views.opions 配置的,需要制定模版引擎的后缀以及引擎的处理函数,还有map 映射
      比如mjml 的配置,如果配置了map,则需要添加engineSource ,engineSource 对应一个支持回掉的函数
     
     views: {
        options: {
          extension: 'mjml', // for mjml 
          map: {
            mjml: 'mjml',
          },
          engineSource: {
            mjml:mjml
          }
        }

    具体处理的源码(回掉处理依赖pify)

    说明

    使用通过配置的方法比较适合比较固定的模版(不需要参数传递),对于需要参数传递的,通过自定义的方式会更方便点,实际上对于需要扩展的
    我们可以通过缓存以及数据库存储的模式(s3 也不错)增强系统的可扩展行性

    参考资料

    https://email-templates.js.org/#/?id=custom-template-engine-e-g-ejs
    https://github.com/rongfengliang/email-templates-mjml-learning/tree/mjml
    https://www.npmjs.com/package/pify

  • 相关阅读:
    CSS 去掉文字选中状态
    解决MAC系统升级导致COCOAPODS失效问题
    qr-mili Tekniskt stöd
    JavaScript 随笔
    Https 单向验证 双向验证
    git 常用指令
    h5或者微信端吊起app
    创建本地服务器环境
    jenkins 关闭和重启的实现
    jenkins 忘记用户名和密码
  • 原文地址:https://www.cnblogs.com/rongfengliang/p/12167521.html
Copyright © 2020-2023  润新知