Three.js has many example files under examples
directory not src
.
To use there from Next.js, We needs to small tweak config.
// next.config.js
const path = require('path')
module.exports = {
webpack: (config) => {
config.resolve.alias['ThreejsExample'] = path.resolve(__dirname, 'node_modules/three/examples')
return config
},
}
// FooComponent.js
import { GLTFLoader } from 'ThreejsExample/jsm/loaders/GLTFLoader'
You can use resolve.modules
intead of resolve.alias
, I like the latter.