在前端开发中，有许多需要发送邮件的场景，比如注册、找回密码、邀请等等。为了方便快捷地生成美观的邮件模板，我们可以使用 npm 包 mailgen。
本教程将介绍如何使用 mailgen 快速创建邮件模板，并通过 Node.js发送邮件。让我们开始吧！
安装
在终端中执行以下命令安装 mailgen：
--- ------- ------- ------
基本用法
Step 1: 引入 mailgen
在需要使用 mailgen 的文件中，使用以下代码引入：
----- ------- - -------------------
Step 2: 创建 mailgen 实例
使用以下代码创建 mailgen 实例：
----- ------------- - --- ---------
------ ----------
-------- -
----- --- -----
----- ---------------------
-- ---- -----
-- ----- -----------------------------------
-
---其中，theme 是邮件的主题风格，支持 default（默认）、cerberus 和 stethee，product 是发件人信息，可以包括 name（发件人名称）、link（发件人链接）和 logo（发件人 logo）。
Step 3: 创建邮件内容
使用以下代码创建邮件内容：
----- ----- - -
----- -
----- -------
------ -------- -- -- ---- -- --- ---- ------- -- ---- --- -- --------
------- -
------------- --- --- ------- ---- -- ---- ------ ----- -------
------- -
------ ----------
----- -------- ---- ---------
----- -----------------------------------
-
--
------ ----- ----- -- ---- ---------- ---- ----- -- ---- ------ ----- ---- -- ------
-
--其中，body 是邮件主体部分，包括 name（收件人姓名）、intro（欢迎语）、action（操作按钮）和 outro（结束语）。
Step 4: 生成 HTML 和纯文本邮件
使用以下代码生成 HTML 和纯文本邮件：
----- --------- - ------------------------------ ----- --------- - --------------------------------------- -------------------- ----------- -------------------- -----------
现在，我们已经成功生成了邮件的 HTML 和纯文本内容。
Step 5: 发送邮件
在 Node.js 中，可以使用以下示例代码发送邮件：
----- ---------- - ----------------------
----- -------- ---------- -
-- ---- ---- ---
----- ----------- - ----------------------------
----- -----------------
----- ----
------- ------ -- ----- -----
----- -
----- -------------------
----- -------------------
-
---
-- ----
----- ----------------------
----- --- --- --------------------- -- ---
--- ------------------------ -- ---
-------- -------- -- -- ------ -- --
----- ---------- -- ---- --
----- --------- -- -----
---
-现在，我们已经成功发送了一封包含 mailgen 生成的邮件模板的邮件。
进阶用法
自定义主题
mailgen 默认提供了三种主题：default、cerberus 和 stethee。除此之外，我们还可以通过调整主题颜色、字体、大小等自定义主题样式。
以下代码示范了如何使用自定义主题：
-- -------
----- ----------- - -
------- -
-------- ----------
----------- ----------
----- ----------
------- -
----------- ----------
------ ---------
-
--
----- -
------- -------- ------ ------------
----- ------
-
--
-- -------
----- ------------- - --- ---------
------ ------------
-------- -
----- --- -----
----- --------------------
-
---自定义操作按钮
mailgen 的邮件主体部分包含一个操作按钮 button，可以自定义按钮的颜色、文本和链接。
以下代码示范了如何自定义操作按钮：
----- ----- - -
----- -
----- -------
------ -------- -- -- ---- -- --- ---- ------- -- ---- --- -- --------
------- -
------------- --- --- ------- ---- -- ---- ------ ----- -------
------- -
------ ----------
----- -------- ---- ---------
----- ------------------------------------
-- ------ --- -- ---
--- ----------
-
--
------ ----- ----- -- ---- ---------- ---- ----- -- ---- ------ ----- ---- -- ------
-
--添加附件
如果需要在邮件中添加附件（如 PDF 文件、图片等），可以使用 nodemailer 的 attachement 配置项。以下代码示范了如何添加附件：
----- ---------- - ----------------------
-- ----
----- ---------- - -
--------- ---------------
----- ------------------------
------------ -----------------
--
-- ---------
----- -------- ---------- -
----- ----------- - ------------------------------ --- -----
----- ----------------------
----- --- --- ---------------------
--- ------------------------
-------- ----- ----------
----- ----------
----- ----------
-- ----
------------ ------------
---
-总结
本教程介绍了 npm 包 mailgen 的基本用法、自定义主题、自定义操作按钮以及添加附件等进阶用法。希望这篇文章能够为你在前端开发中使用邮件模板提供帮助和指导。需要注意的是，mailgen 仅能生成邮件模板，发送邮件需要使用类似 nodemailer 的第三方库。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5eedb51fb5cbfe1ea06113d4