#reactDOMServer.renderToPipeableStream is not a function (react.email)

1 messages · Page 1 of 1 (latest)

lofty crescent
#

Getting this error. When I redeploy it goes away, but it has come back twice after a while.

Coming from @react-email with these versions:
"@react-email/components": "0.0.36",
"@react-email/render": "1.0.6",

TypeError: reactDOMServer.renderToPipeableStream is not a function
    at __spreadValues.selectors (file:///node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@react-email/render/dist/node/index.mjs:162:37)
    at new Promise (<anonymous>)
    at file:///node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@react-email/render/dist/node/index.mjs:161:11
    at Generator.next (<anonymous>)
    at fulfilled (file:///node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@react-email/render/dist/node/index.mjs:24:24)
woven sparrowBOT
#

Hi @lofty crescent. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

This error appears to be related to React Email compatibility issues when using it with Trigger.dev. Based on the knowledge sources, I can provide some insights on how to resolve this issue.

The error reactDOMServer.renderToPipeableStream is not a function typically occurs when there's a version mismatch between React and React DOM, or when the React Email rendering is not compatible with your current React setup.

Here are some potential solutions:

  1. Check React version compatibility: You're using React 19.0.0 with React Email, which might be causing compatibility issues. The examples in the documentation use React Email with older versions of React.

  2. Use the render function properly: In the examples from the documentation, React Email is used with the render function from "@react-email/render" rather than directly accessing renderToPipeableStream. For example:

import { render } from "@react-email/render";
// Then later in your code
html: render(<HNSummaryEmail articles={summaries} />),

As shown in the Scrape Hacker News example.

  1. Update your packages: Try running the Trigger.dev update command to ensure all packages are compatible:
npx trigger.dev@latest update

As mentioned in the upgrading packages documentation.

  1. Redeploy your task: As you mentioned, redeploying fixes the issue temporarily. This suggests it might be related to how the code is being built or bundled. You can try a clean deployment:
npx trigger.dev@latest deploy
  1. Try a dry run to debug: You can use the dry run option to see what's being built without actually deploying:
npx trigger.dev@latest deploy --dry-run
#

This will help you inspect the built code as mentioned in the troubleshooting documentation.

If the issue persists, you might want to consider downgrading your React version to one that's known to work well with React Email, or join the Trigger.dev Discord for more specific help with this issue.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@lofty crescent Kapa.ai is still learning and improving, please let me know how I did by reacting below.

grand harbor
grand harbor
#

If I add this to my trigger config it is resolved:

  build: {
    external: ["react", "react-dom", "@react-email/render", "@react-email/components"]
  }
uncut hare