Questions tagged [react-18]
153 questions
3
votes
2 answers
How can server-side components communicate with client-side components in React?
I'm working with Next.js and am testing their new way of data fetching but this can be a general React 18+ question too as the library itself is shifting towards a distinction between client and server components.
Suppose I have the setup:
//…
driftingaway
- 39
- 1
3
votes
3 answers
Issue while trying to initialize the react property
Issue details
.env value not initialized in the react property
siteKey value is always blank
Property in react
const [siteKey] = useState(process.env.REACT_CAPTCHA_SITE_KEY);
Key in .env
REACT_CAPTCHA_SITE_KEY='some key'
Html
Pankaj
- 9,749
- 32
- 139
- 283
3
votes
0 answers
Can't use createRoot with typeScript - "TypeError: m.createRoot is not a function"
I'm working on a project using React 18 and Leaflet. (I don't believe Leaflet is part of the problem but it might be worth mentioning.) I'm trying to add custom elements to the map, but using createRoot gives me TypeError: m.createRoot is not a…
LLauk
- 31
- 3
3
votes
1 answer
Delete `import React form 'react'` from components that don't need it(React 17 or higher)
I just noticed that in React 17 or higher we don't need to import react on top of each component so components like this:
import React from 'react'
export const Cmp = () => {
return (
Text
)
}
can become this:
export const…
ali mirzaei
- 309
- 1
- 3
- 12
3
votes
0 answers
How to make validation for phone number update as user is typing using react hook form?
I am using React Hook Form validation with Yup. I would like the validation on phone number to update as the user is typing but it is only showing once the user clicks out of the input or hits submit. I have the mode set to 'all'. This is a valid…
dev_in_training
- 333
- 5
- 16
3
votes
2 answers
emotion with react 18 and typescript
The css prop isn't working when I try to use create-react-app with react 18, typescript and emotion 11 — elements are still onstyled, and in the DOM the element has a css attribute whose value is:
You have tried to stringify object returned from…
Noah
- 496
- 5
- 12
3
votes
2 answers
Get error while installing react-notifications-component package with React 18
I used react-notifications-component (npm) before and it was working fine. but recently I tried to install it with react 18 and I got this error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While…
Raskul
- 1,674
- 10
- 26
3
votes
1 answer
create react app react 18 with typescript
I am trying to create react 18 app with TypeScript, I tried following this guide but I can't make it work. I can't add "types": ["react/next", "react-dom/next"] to tsconfig file. I'm getting error:
Cannot find type definition file for…
Wings
- 502
- 4
- 14
3
votes
1 answer
Why render error in react v18 occures although I do not use legacy code?
Hy, guys!
I have a render error in my react v18 code like this:
Warning: react-dom.development.js:86 Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if…
DenisF
- 31
- 1
- 2
3
votes
1 answer
TypeError: Cannot set property 'usingClientEntryPoint' of undefined
In react-18.0.0 version app I'm writing test case for index.js file I'm getting following error
● Application root › should render without crashing
TypeError: Cannot set property 'usingClientEntryPoint' of undefined
5 | import reportWebVitals…
KARTHIKEYAN.A
- 18,210
- 6
- 124
- 133
2
votes
0 answers
How do I make React app as server side using express?
I am trying React18 + express to make my react as server rendered application.
I have created a very simple express server that is supposed to send an HTML code to the browser.
import express from "express"
import React from "react"
import {…
anshul
- 661
- 9
- 27
2
votes
0 answers
SSR error in React 18: "This root received an early update, before anything was able hydrate. Switched the entire root to client rendering."
I'd really appreciate if someone could help me out. Here is my current setup in index.js. I don't understand why I get the error mentioned above.
import React from "react";
import "normalize.css";
import "./index.css";
import App…
YanaTheOne
- 21
- 1
2
votes
2 answers
Property 'children' does not exist on type
We are trying to migrate to react 18.
The children prop was removed from React.FunctionComponent (React.FC) so you have to declare it explicitly in your component properties.
But we want to keep the old React.FunctionComponent with children…
ajm
- 12,863
- 58
- 163
- 234
2
votes
1 answer
I have an error when updating my single-spa to React 18
I'm working on a single-spa React version 5.9.4, which currently it is configured with react 17. But when I try to update to React 18, it doesn't recognize the createRoot method from DOMClient, which is set up like this:
react-mf-hello-world.tsx…
Sabrina Lucero
- 31
- 6
2
votes
0 answers
Bug with click event in react 18
The react version I'm using is:
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
Here's some simple code for the dropdown.
import { MouseEvent, useEffect, useState } from 'react';
import type { ReactNode } from…
Jeongmin Lee
- 23
- 2