react icon indicating copy to clipboard operation
react copied to clipboard

Bug: there is no renderToReadableStream function in [email protected] in Node.js

Open krutoo opened this issue 2 years ago • 23 comments

I try to use renderToReadableStream function from react-dom/server in Node.js but there is no such function in package.

React version: 18.2.0 Node.js version 16.15.0 or 18.16.0

Steps To Reproduce

  1. create index.mjs file
  2. insert code:
    import { renderToString, renderToReadableStream } from "react-dom/server";
    
    console.log({ renderToString, renderToReadableStream });
    
  3. run node index.mjs in terminal

Link to code example:

StackBlitz

The current behavior

Error in terminal:

file:///Users/user/Projects/node-fetch-api-server/index.mjs:1
import { renderToString, renderToReadableStream } from "react-dom/server";
                         ^^^^^^^^^^^^^^^^^^^^^^
SyntaxError: Named export 'renderToReadableStream' not found. The requested module 'react-dom/server' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'react-dom/server';
const { renderToString, renderToReadableStream } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:190:5)

Node.js v18.16.0

The expected behavior

Node.js suupports web streams in experimental mode.

The package react-dom/server must have a function renderToReadableStream according to the documentation: https://react.dev/reference/react-dom/server/renderToReadableStream

krutoo avatar Jun 06 '23 05:06 krutoo

Hello I think this is not the bug in React-dom I have checked both the official documentation repository there are mentions about the reanderToReadableStream there you wrote an incorrect code here is the updated code.

import ReactDOMServer from 'react-dom/server;

const { renderToString, renderToReadableStream } = ReactDOMServer;

console.log({ renderToString, renderToReadableStream });

because the error says that it is the syntax error Named export 'renderToReadableStream' not found. The requested module 'react-dom/server' is a CommonJS module, which may not support all module.exports as named exports.

MeenuyD avatar Jun 06 '23 13:06 MeenuyD

@MeenuyD I tried your snippet and it doesn't work either

krutoo avatar Jun 06 '23 16:06 krutoo

Node.js exposes WebStream to global since 18.+, but react-dom/server does not export renderToReadableStream without checking if it present.

thynson avatar Jun 14 '23 03:06 thynson

Is it possible to add renderToReadableStream to Node.js package?

krutoo avatar Jun 14 '23 09:06 krutoo

Ditto - often when building and testing things locally the runtime is node, while the final deploy target is edge (cloudflare, etc). Because renderToReadableStream is not exposed on the node build, we have to do a dance to make everything work.

Any particular reason to not include renderToReadableStream on the node build? Made sense when node did not have support for web streams, but it has for a while now, and now that everybody seems to be converging on the web streams standard perhaps it makes more sense to include?

marbemac avatar Oct 11 '23 17:10 marbemac

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

github-actions[bot] avatar Apr 09 '24 15:04 github-actions[bot]

bump

marbemac avatar Apr 09 '24 15:04 marbemac

Bump, there is no export from the ./server.node.js file. Is there a reason for it?

ondrej-langr avatar Apr 13 '24 13:04 ondrej-langr

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

github-actions[bot] avatar Jul 12 '24 14:07 github-actions[bot]

bump

marbemac avatar Jul 16 '24 18:07 marbemac

bump

anjunar avatar Jul 17 '24 11:07 anjunar

bump

eu-ge-ne avatar Aug 07 '24 04:08 eu-ge-ne