reactjs / React.NET

.NET library for JSX compilation and server-side rendering of React components
https://reactjs.net/
MIT License
2.3k stars 932 forks source link

ReferenceError: TextEncoder is not defined #1309

Open m1is opened 2 years ago

m1is commented 2 years ago

I created a ReactJS.NET project using the reactnet-webpack template, then upgraded it from React 16 to the latest v18. However when I try to run the out of the box example I get the following error:

ReferenceError: TextEncoder is not defined at eval (:145:19) -> var textEncoder = new TextEncoder(); at eval (:7002:5) at ./node_modules/react-dom/cjs/react-dom-server.browser.development.js (vendor.6d1c51ef.js:23:1) at webpack_require__ (runtime.36e5d9f0.js:85:30) at eval (:6:7) at ./node_modules/react-dom/server.browser.js (vendor.6d1c51ef.js:59:1) at webpack_require (runtime.36e5d9f0.js:85:30) at eval (:6:74) at eval (:47:30) at ./Content/components/expose-components.js (main.ab0e9b20.js:35:1) at webpack_require__ (runtime.36e5d9f0.js:85:30) at checkDeferredModules (runtime.36e5d9f0.js:46:23) at webpackJsonpCallback (runtime.36e5d9f0.js:33:19) at vendor.6d1c51ef.js:1:53 at JavaScriptEngineSwitcher.V8.V8JsEngine.InnerExecute(String code, String documentName) at JavaScriptEngineSwitcher.Core.JsEngineBase.Execute(String code, String documentName) at React.JavaScriptEngineFactory.LoadUserScripts(IJsEngine engine)

How would I go about resolving this?

ChristianGilmer commented 2 years ago

try downgrading to react and react-dom 16.12.0

LinusCenterstrom commented 2 years ago

change the import of ReactDOMServer to be from either "react-dom/cjs/react-dom-server-legacy.browser.development" or "react-dom/cjs/react-dom-server-legacy.browser.production.min.js" instead of reactdom/server

m1is commented 2 years ago

change the import of ReactDOMServer to be from either "react-dom/cjs/react-dom-server-legacy.browser.development" or "react-dom/cjs/react-dom-server-legacy.browser.production.min.js" instead of reactdom/server

I already abandoned this, just too many issues trying to get it to work with Material UI.

sebastian-pierre commented 2 years ago

Above solution with linking to the legacy files does not work for me. It keeps throwing the same error, and / or TextEncoder is not a constructor.

dustinsoftware commented 2 years ago

Sorry, don’t know of a fix for this. As others have noted, probably best to move to another library if you need react 18 support.

Probably need to add a note that the library is in maintenance mode, and folks should stick with react 16 as long as they are on this library.

On Thu, Aug 25, 2022 at 13:49, m1is @.***> wrote:

change the import of ReactDOMServer to be from either "react-dom/cjs/react-dom-server-legacy.browser.development" or "react-dom/cjs/react-dom-server-legacy.browser.production.min.js" instead of reactdom/server

I already abandoned this, just too many issues trying to get it to work with Material UI.

— Reply to this email directly, view it on GitHub https://github.com/reactjs/React.NET/issues/1309#issuecomment-1227584782, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAHGCFWMQMWZOKEWJOBARXTV26W3PANCNFSM57CFIEZQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>

dineshpannu commented 2 years ago

I added https://github.com/anonyco/FastestSmallestTextEncoderDecoder as a polyfill in my server webpack configuration and that seemed to have fixed it.

LorenDorez commented 1 year ago

This is due to change React v18 added. The only work around at this time would be to add a polyfill to your build scripts. I started a discussion about plans i have to bring this project up to better support React v18 but its going to require some major changes. https://github.com/reactjs/React.NET/discussions/1343