1
    Could not resolve "three"
    
        node_modules/three-mesh-bvh/src/core/castFunctions.js:1:39:
          1 │ import { Box3, Vector3, Matrix4 } from 'three';
            ╵                                        ~~~~~~~
    
     

You can mark the path "three" as external to exclude it from the bundle, which will remove this error.

AND HERE IS MY CODE...



    import React, {Suspense, useEffect, useState} from 'react'
    import { Canvas } from '@react-three/fiber';
    import { OrbitControls, Preload, useGLTF } from '@react-three/drei';
    
    import CanvasLoader from '../Loader';
    
    const Computers = () => {
      const computer = useGLTF('./desktop_pc/scene.gltf')
      return (
        <div>Computers</div>
      )
    }
    
    export default Computers

1 Answers1

2

Seems like you haven't properly installed the 'three' package.

Open a terminal, cd to your root folder (that contains your package.json and tsconfig.json/jsconfig.json) and run npm list. This will show you all of the packages you've installed for your current project.

If 'three' doesn't show up, you must npm i three --save (or npm i three @types/three --save of you're using TypeScript).

Make sure your tsconfig.json file states:

{
    "dependencies": {
        "@types/three": "^0.149.0" // if you're using TypeScript
        "three": "^0.150.1" 
        // or the latest version(s) at the moment
    }
}

Always make sure you thoroughly read the docs.