Closed genekyle closed 1 year ago
closing this because some how after adding random import it starts to work again
how i got the same problem?
how i got the same problem?
My actual problem was I forgot to export ComputersCanvas at the very end line, so make sure you're exporting the right function at the end of Computers.jsx or else after you reload it once or twice the canvas won't load in properly
yeah its correct but when i try to load the localhost website it shows blank in black colour..In Console i get the following error:-
2index-37bd4d5c.esm.js:1016 Text is not allowed in the R3F tree! This could be stray whitespace or characters. handleTextInstance @ index-37bd4d5c.esm.js:1016 react-reconciler.development.js:9747 The above error occurred in the
at div
at Loader
at Suspense
at Suspense
at ErrorBoundary (http://localhost:5173/node_modules/.vite/deps/chunk-GQZEGRTH.js?v=fd224788:46041:5)
at FiberProvider (http://localhost:5173/node_modules/.vite/deps/chunk-GQZEGRTH.js?v=fd224788:48048:21)
at Provider (http://localhost:5173/node_modules/.vite/deps/chunk-GQZEGRTH.js?v=fd224788:47650:3)
React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary. logCapturedError @ react-reconciler.development.js:9747 2react-three-fiber.esm.js:145 Uncaught Error: R3F: Div is not part of the THREE namespace! Did you forget to extend? See: https://docs.pmnd.rs/react-three-fiber/api/objects#using-3rd-party-objects-declaratively at createInstance (index-37bd4d5c.esm.js:836:15) at completeWork (react-reconciler.development.js:10851:28) at completeUnitOfWork (react-reconciler.development.js:18725:16) at performUnitOfWork (react-reconciler.development.js:18697:5) at workLoopSync (react-reconciler.development.js:18597:5) at renderRootSync (react-reconciler.development.js:18565:7) at recoverFromConcurrentError (react-reconciler.development.js:17948:20) at performConcurrentWorkOnRoot (react-reconciler.development.js:17848:22) at workLoop (scheduler.development.js:266:34) at flushWork (scheduler.development.js:239:14) react-dom.development.js:18687 The above error occurred in the <ForwardRef(Canvas)> component:
at Canvas (http://localhost:5173/node_modules/.vite/deps/chunk-GQZEGRTH.js?v=fd224788:48186:3)
at FiberProvider (http://localhost:5173/node_modules/.vite/deps/chunk-GQZEGRTH.js?v=fd224788:48048:21)
at CanvasWrapper
at ComputersCanvas
at section
at Hero
at div
at div
at Router (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=fd224788:3316:15)
at BrowserRouter (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=fd224788:3729:5)
at App
Consider adding an error boundary to your tree to customize error handling behavior. Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries. logCapturedError @ react-dom.development.js:18687 react-dom.development.js:26923 Uncaught Error: R3F: Div is not part of the THREE namespace! Did you forget to extend? See: https://docs.pmnd.rs/react-three-fiber/api/objects#using-3rd-party-objects-declaratively at createInstance (index-37bd4d5c.esm.js:836:15) at completeWork (react-reconciler.development.js:10851:28) at completeUnitOfWork (react-reconciler.development.js:18725:16) at performUnitOfWork (react-reconciler.development.js:18697:5) at workLoopSync (react-reconciler.development.js:18597:5) at renderRootSync (react-reconciler.development.js:18565:7) at recoverFromConcurrentError (react-reconciler.development.js:17948:20) at performConcurrentWorkOnRoot (react-reconciler.development.js:17848:22) at workLoop (scheduler.development.js:266:34) at flushWork (scheduler.development.js:239:14) :5173/desktop_pc/scene.gltf:1 Failed to load resource: the server responded with a status of 404 (Not Found) three.module.js:27651 THREE.WebGLRenderer: Context Lost.
Full Error: Warning: The tag is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.
Found this error within chrome's browser console: This error visually seems to not load the scene.gltf within the computer.jsx component.
I am getting this error along with: