Can not load GLTFLoader in nextjs application!

Questions
,
11

I used this:

import React, { Suspense, useEffect, useRef } from 'react'
import { Canvas, useLoader, useThree  } from 'react-three-fiber'

let GLTFLoader

function Model(props) {
  GLTFLoader = require('three/examples/jsm/loaders/GLTFLoader').GLTFLoader
  const group = useRef()
  const gltf = useLoader(GLTFLoader, 'glb/model.glb')
  return (
<group ref={group} {...props} dispose={null}>
  <mesh 
    material={gltf.materials.lambert2SG} 
    geometry={gltf.nodes.Object_3.geometry} 
    scale={[0.03, 0.03, 0.03]} 
    material-color=""/>
  <mesh 
    material={gltf.materials.lambert2SG} 
    geometry={gltf.nodes.Object_4.geometry} 
    material-color="red" />
</group>
  )
}
1 Like