overlookmotel/react-async-ssr

Uncaught Invariant Violation: ReactDOMServer.renderToNodeStream(): The streaming API is not available in the browser. Use ReactDOMServer.renderToString() instead

mowais-ac opened this issue · 8 comments

I am trying to integrate this plugin into my existing application but It's giving me the following error,

Error

Uncaught Invariant Violation: ReactDOMServer.renderToNodeStream(): The streaming API is not available in the browser. Use ReactDOMServer.renderToString() instead

src/index.js

const { renderToStringAsync } = require('react-async-ssr');
async function render() {
    const html = await renderToStringAsync( <App /> );
    return html;
}

package.json

"dependencies": {
    "react-async-ssr": "^0.7.2",
},
"devDependencies": {
    "react-async-ssr": "^0.7.2",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
}

Are you trying to use this in browser? I'm afraid that's not supported - it's only intended for server-side use. This is due to a restriction in React itself.

ok, so how index.js code should be managed, can you please share any example?

I'm sorry but I don't understand your question. Is src/index.js client-side or server-side code?

This library is designed for server-side rendering. If you're just wanting to render React in browser, you don't need this library at all. Just use the .render() method provided by react-dom.

If I've misunderstood, you'll need to explain to me in much more detail what you're trying to do for me to be able to help.

ok, so currently I don't have server-side configuration I am just using react-router-dom, can you please share any repository/documentation which I can follow to make my website serverside, because I have already built a huge website that is based on react + redux + webpack + sass, and its really hard to move all the code into any other library, so I was looking for quick and easy solution which I can use to make my website SSR enabled.

I was expecting this package to do it same as I described above but I have no idea about the server side files and how it will connect my current react app to server

Ah I understand. Probably you don't need this library unless you use Suspense in your app.

I would suggest reading the React docs and google "React server side render" - there are a bunch of blog posts on this subject.

Depending on what you use for data fetching, you may find it's quite complicated to do.

But this is the bug tracker for this particular library, and this isn't a bug report. I'm afraid I can't enter into helping people with general React queries due to lack of time. Stack Overflow is a better place for questions and help.

hmm... well I am struggling on this quite a lot , applied almost everything, I got so many articles most of them are deprecated and few of them have already so many bugs and not using the redux + webpack + saass

I do feel your pain, it's complicated. But like I said, this I'm afraid this isn't the right place for your questions.

Just so you hopefully can see it from my side too: I maintain a whole load of open source libraries. I don't get paid for this, and have (like everyone else) limited time. I'd say 50% of the issues that get opened on my repos have actually nothing to do with the libraries. It takes time to sift through them and figure out what's an actual bug report and what's not. That uses up the limited time I have and means I have less time to do what's of most value - actually maintaining and improving the libraries.

This is a common problem a lot of open source maintainers have. So in short: if you have problems you need to solve, either go to places (like Stack Overflow) where people are willing to and want to help others or, if this is part of your job, pay someone to consult for you. Otherwise - and I know you didn't mean it this way, but it is actually how it is - you're asking a complete stranger to give their time for free to help you to do your job which you're paid for. This is not fair.

I hope you take this in the spirit in which it's intended - I'm trying to point you in the right direction - and not as an insult. But let's not discuss any further. I genuinely hope you find a way to solve your problem.

you took it wrong, I was not asking for the help, I was just tried to describe the problem that I faced while using this library, maybe because of the lack of proper documentation, because I didn't notice anywhere that this is for the serverside or for the client-side specifically,

BTW, no worries, of course, It's my problem and only I am responsible to solve this without any doubt.

Thanks