Open ahmadzreqat opened 1 year ago
not working with react dom v: 18
Hi guys, Is there any updates for React 18?
Aww sad to hear, I was about to try it out. Did you ever find a workaround or alternative?
Encountering the same issue with this. ðŸ˜
@Abhishek1350 Thank you . It works but the styles are broken . Do you have any solution for that?
@Nayem55 Not sure about the broken styles, But you can try these steps.
Also when you deploy your app, check the page content by clicking on "view page source" in the browser. And see if you are getting the expected page content.
Apply these steps one by one and let me know what works!
Okk .. I'll try this and let you know
Hello Guys,, do we have any news about any update of this library? is it still compatimple with react 18?
Hey guys, just had the same problem. Looking at the React 18 API Docu, I solved it like this and it works. Hope it helps.
const rootElement = document.getElementById('root') as HTMLElement
const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement)
const queryClient = new QueryClient()
if (rootElement.hasChildNodes()) {
ReactDOM.hydrateRoot(
rootElement,
<BrowserRouter>
<Auth>
<React.StrictMode>
<QueryClientProvider client={queryClient}>
<App />
</QueryClientProvider>
</React.StrictMode>
</Auth>
</BrowserRouter>
)
} else {
root.render(
<BrowserRouter>
<Auth>
<React.StrictMode>
<QueryClientProvider client={queryClient}>
<App />
</QueryClientProvider>
</React.StrictMode>
</Auth>
</BrowserRouter>
)
}
I'm doing this, but it is still not working, see error below:
Using "react-dom": "~18.2.0", "react-router": "~6.22.0", and createBrowserRouter
import React from "react";
import { createRoot, hydrateRoot } from "react-dom/client";
import { App } from "@/components";
const rootElement = document.getElementById("app") as HTMLElement;
if (rootElement.hasChildNodes()) {
hydrateRoot(
rootElement,
<React.StrictMode>
<App />
</React.StrictMode>,
);
} else {
createRoot(document.getElementById("app")!).render(
<React.StrictMode>
<App />
</React.StrictMode>,
);
}
ERROR
webpack 5.90.3 compiled successfully in 10248 ms
🔥 pageerror at /: SyntaxError: Unexpected token '.'
✅ crawled 1 out of 1 (/)
error An unexpected error occurred: "Command failed.
Any Ideas
Bug Report
Current Behavior A clear and concise description of the behavior.
Reproducible demo Link to GitHub repository or codesandbox with a demo of the bug behavior.
Expected behavior/code A clear and concise description of what you expected to happen (or code).
Possible Solution
Additional context/Screenshots Add any other context about the problem here. If applicable, add screenshots to help explain.