用拖拽和 AI
快速设计专业邮件
描述你想要的邮件，让 AI 生成初稿；也可以直接拖拽区块自行搭建。 这是一个面向 Vue 3 的邮件编辑器，内置 AI Chat、47 个免费模板、 MJML 渲染和完整响应式预览。
使用现成模板更快上线
所有模板都随 npm 包一起提供，无需账号，也无需额外 API 调用。 导入后即可在编辑器中定制，并导出可用于生产的 HTML。
import { starterTemplates } from '@fpfe-group/email-editor-ai'1. AI 驱动的模板生成
用自然语言描述邮件需求，让 AI 直接搭建完整模板。内置 AI Chat 面板可以根据 简单 prompt 生成可用于生产的 MJML 模板，并在应用前提供完整预览。你也可以继续 对话，让 AI 调整颜色、添加区块或修改布局，并即时看到结果。通过灵活的 BYOAI 模式， 可以接入 OpenAI、Anthropic 或任意 LLM，从初稿到最终设计都更高效。
2. 适配各种设备的响应式邮件
每封邮件都通过 MJML 渲染。MJML 是响应式邮件标记的行业常用方案，能让设计自动适配 不同屏幕尺寸，从桌面宽屏到移动端小屏都能保持清晰结构。发送前可以实时查看多个断点下 的布局效果，尽量确保在 Gmail、Outlook、Apple Mail 等邮件客户端中稳定呈现， 减少表格错位和列宽异常。
3. 可完全定制的邮件模板
你可以控制邮件模板中的每一个元素。通过直观的可视化界面调整色板、排版、间距和布局结构， 不需要编写代码。品牌 Logo、字体和配色等预设可以在不同活动中复用，让沟通内容保持一致。 无论是自定义页头组合，还是定制化页脚布局，每个组件都能服务于品牌表达。
4. 可视化拖拽编辑
无需手写 HTML，也能构建漂亮的邮件。拖拽式编辑器让你把内容区块放到合适位置， 快速组合出专业布局。你可以从预置区段中选择页头、列、图片、按钮等元素， 再通过清晰的可视化面板定制细节。现代 Vue 架构让编辑体验更顺滑，也兼顾设计自由度和技术准确性。
快速开始
3 步接入并运行
Drop it into your Vue app and start building emails instantly.
安装依赖包
npm i @fpfe-group/email-editor-ai导入组件
<EmailEditor :templates="templates" />定制并发送
Choose a template, customize it visually, export responsive HTML.
开发者为什么喜欢它
被团队信任的邮件编辑器
“拖拽式编辑器改变了我们制作邮件活动的方式。过去需要几个小时的工作， 现在几分钟就能完成。MJML 输出很干净，在各类邮件客户端中的渲染也稳定。”
“我们评估过市面上的邮件构建器，很少有工具能同时提供这种灵活性和清爽的开发体验。 设计师喜欢可视化编辑器，开发同事也认可它输出的代码。”
“接入真的不到一分钟。我们把它放进 Vue 应用，接上自己的 API， 当天下午就上线了完整的邮件模板构建能力。开发体验很顺。”
今天就开始使用
几分钟内搭建
精美邮件
和开发者、营销团队一起使用 email-editor-ai，
无需手写 HTML，也能创建精美的响应式邮件。
npm install @fpfe-group/email-editor-ai