본문 바로가기

Framework/React5

[React] Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it. 이슈 1 router element를 컴포넌트로 호출안해서 생긴 이슈입니다. import React from "react"; import Home from "pages/Home"; import { createBrowserRouter, RouterProvider } from "react-router-dom"; const router = createBrowserRouter([ { path: "/", element: Home, }, ]); function App() { return ( ); } export default App; 해결 방안 import React from "react"; import Home from "pages/Home"; import { createBrowserRouter, RouterPr.. 2023. 9. 17.
Warning Received 'true' for non-boolean attribute react-dom.development.js:84 Warning: Received `true` for a non-boolean attribute `{속성이름}`. If you want to write it to the DOM, pass a string instead: {속성이름}="true" or {속성이름}={value.toString()}. style-componets에서 속성에 맞지 않는 값을 넣으면 나타나는 경고 문구입니다. 올바른 속성 값을 넣으면 더이상 표기안되는 걸 확인하실 수 있습니다. 2023. 9. 1.
[React] React 새로운 Root Document 생성하기 React 18.2.0 기준으로 작성 된 글입니다. 필자에 경우 react-force-graph를 사용해서 3D 차트를 구현하던 중 싱글 페이지로 구현이 되어있어 여러개의 차트를 그릴 경우 아래와 같이 타입에러가 발생했습니다. Cannot read properties of undefined (reading 'children') TypeError: Cannot read properties of undefined (reading 'children') at emptyObject (http://localhost:3000/static/js/bundle.js:663004:14) at _objectSpread2.objBindAttr (http://localhost:3000/static/js/bundle.js:6630.. 2023. 8. 8.
[React] Uncaught ReferenceError: Buffer is not defined in React 리액트 17 버전에서 18 버전으로 변경하면서 아래와 같은 오류가 나와서 해결한 내용을 정리합니다. Uncaught ReferenceError: Buffer is not defined in React 해결방안 buffer 설치 npm npm install --save buffer yarn yarn add buffer --save App.js 추가 import React from "react"; ... import { Buffer } from "buffer"; Buffer.from("anything", "base64"); window.Buffer = window.Buffer || require("buffer").Buffer; const App = () => { ... }; export default App.. 2023. 8. 1.
[React] 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 it's running React 17. 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 it's running React 17. Learn more: https://react.dev/blog/2022/03/08/react-18-upgrade-guide#updates-to-client-rendering-apis How to Upgrade to React 18 – React The library for web and native user interfaces react.dev React 17 버전에서 18 버전으로 변경 했을 시 생기는 이슈.. 2023. 8. 1.