我使用Next Js作为前端，Nest Js作为后端，AWS SES v2作为电子邮件服务。目前，我发送电子邮件使用EJS电子邮件模板，我在后端。我想切换到React电子邮件。但是React电子邮件是在前端生成的，并且使用JSX，那么我如何在我的项目中实现React电子邮件呢？
ddrv8njm1#
React Email使用React作为其语法。你可以在后台使用React Email，如下所示：1.在你的后台创建一个类似电子邮件文件夹的东西。1.使用npm install react-email @react-email/button @react-email/html -E在顶级后端文件夹中安装所需的依赖项1.将email:dev脚本添加到后端package.json，如下所示：
npm install react-email @react-email/button @react-email/html -E
email:dev
package.json
{ "scripts": { "dev": "email dev" } }
1.在之前创建的emails文件夹中创建一个演示电子邮件，如下所示：
emails
import { Button } from "@react-email/button"; import { Html } from "@react-email/html"; import * as React from "react"; export default function Email() { return ( <Html> <Button href="https://example.com" style={{ background: "#000", color: "#fff", padding: "12px 20px" }} > Click me </Button> </Html> ); }
1.使用npm run emails:dev预览
npm run emails:dev
在这一切之后，你必须真正发送电子邮件。按照以下步骤开始发送邮件：1.创建名为/send-email的API路由1.在API路由中，使用以下代码并根据需要进行调整。
/send-email
import { render } from '@react-email/render'; import { SES } from '@aws-sdk/client-ses'; import Email from '../../emails/email'; const ses = new SES({ region: process.env.AWS_SES_REGION }) const emailHtml = render(Email({ url:"https://example.com" })); const params = { Source: '[email protected]', Destination: { ToAddresses: ['[email protected]'], }, Message: { Body: { Html: { Charset: 'UTF-8', Data: emailHtml, }, }, Subject: { Charset: 'UTF-8', Data: 'hello world', }, }, }; await ses.sendEmail(params);
资料来源：
1条答案
按热度按时间ddrv8njm1#
安装及基础设置
React Email使用React作为其语法。你可以在后台使用React Email，如下所示：
1.在你的后台创建一个类似电子邮件文件夹的东西。
1.使用
npm install react-email @react-email/button @react-email/html -E在顶级后端文件夹中安装所需的依赖项1.将
email:dev脚本添加到后端package.json，如下所示：1.在之前创建的
emails文件夹中创建一个演示电子邮件，如下所示：1.使用
npm run emails:dev预览发送邮件
在这一切之后，你必须真正发送电子邮件。按照以下步骤开始发送邮件：
1.创建名为
/send-email的API路由1.在API路由中，使用以下代码并根据需要进行调整。
资料来源：