react-email
react-email copied to clipboard
Published
20 hours ago •
resendlabs
resendlabs
Unclear error messages when email templates generate invalid HTML for the preview server
Describe the Bug
I'm using react-email within my current next.js 15 app router project.
This is a new project but ive got a similar setup with the pages router in another project. I keep getting an error whenever I try to embed anything in the <Column> component.
Which package is affected (leave empty if unsure)
No response
Link to the code that reproduces this issue
private
To Reproduce
create a new nextjs 15 app router app (npx create-t3-app is what i ran) manually create the emails folder in src/emails.
run the npm run email --dir=src/email
Remove anything from the column component (should render) Add something within the column component (will crash)
import { Button, Column, Html, Section, Text } from "@react-email/components";
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>
<Section style={{ paddingLeft: "20px", paddingRight: "20px", backgroundColor: "#FFF" }}>
<Column>
<Text style={{ fontSize: "8px" }}>This is an automatic email sent from a mailbox that is not monitored</Text>
</Column>
</Section>
</Html>
);
}
Expected Behavior
Renders the email template
What's your node version? (if relevant)
node 18.19.1, npm 10.2.4
