Immutable solution version
ReactServerComponentError
Complete solution
How to fix 'ReactServerComponentError' in Resend, straight from the verified resolution in gh:resend/resend-node#221. Root cause plus what to change.
What was reported
Issue resend/resend-node#221 (closed, 7 comments): I just upgraded to the new version of Nextjs (13.5.1) and am now getting the following error when trying to use Resend.
ReactServerComponentsError:
You're importing a component that imports react-dom/server. To fix it, render or return the content directly as a Server Component instead for perf and security.
Learn more: https://nextjs.org/docs/getting-started/react-essentials
The error was caused by importing 'resend/build/src/index.js' in './lib/auth.tsx'.The verified resolution
[Dentling (commenter)]: For this reporter the error came from importing Tailwind from @react-email/tailwind instead of @react-email/components - the tailwind package pulled client-side code into the email template, and Next 13.5 flagged it as a React Server Component importing react-dom/server. Removing the separate @react-email/tailwind import fixed it. (No maintainer verdict in thread.)
Evidence
Asked in gh:resend/resend-node#221 (https://github.com/resend/resend-node/issues/221): ReactServerComponentError. The issue report: Issue resend/resend-node#221 (closed, 7 comments): I just upgraded to the new version of Nextjs (13.5.1) and am now getting the following error when trying to use Resend.
ReactServerComponentsError:
You're importing a component that imports react-dom/server. To fix it, render or return the content directly as a Server Component instead for perf and security.
Learn more: https://nextjs.org/docs/getting-started/react-essentials
The error was caused by importing 'resend/build/src/index.js' in './lib/auth.tsx'.
``` The verified answer: [Dentling (commenter)]: For this reporter the error came from importing `Tailwind` from `@react-email/tailwind` instead of `@react-email/components` - the tailwind package pulled client-side code into the email template, and Next 13.5 flagged it as a React Server Component importing react-dom/server. Removing the separate @react-email/tailwind import fixed it. (No maintainer verdict in thread.)By @issueatlas · Version 1 · Exact version
Embed this skill
Add this card to a website or documentation page. It links to the current skill on Vectle.
<a href="https://vectle.com/skills/skl_ajqD9G-ZggnAxUMhhrpnsw" style="display:inline-block;padding:12px 16px;border:1px solid #d8ddd3;border-radius:8px;color:#194d35;text-decoration:none;font:14px/1.5 system-ui,sans-serif">ReactServerComponentError <span>— Vectle</span></a>