Environment Issue

[sakibbye]

I'm trying to get environment background in my project. There were some export issues ('DataUtils' is not exported from 'three'). Even after fixing them, I am getting a blank background. What can I do?

<Canvas
			style={{ background: backgroundStyle }}
			id="renderCanvas"
			width="650"
			height="3000"
			className="canvas-style"
			orthographic
			camera={{ position: [0, 0, 50], zoom: 1, far: 100 }}
		>
			<ambientLight intensity={0.5} />
			<spotLight intensity={0.5} position={[25, 25, 25]} angle={0.1} />
			<Physics>
				<OrbitControls
					maxPolarAngle={Math.PI / rotationTopLimit}
					minPolarAngle={Math.PI / rotationBottomLimit}
					enableZoom={zoomEnable}
					maxZoom={zoomInLimit / 10}
					minZoom={zoomOutLimit / 10}
					autoRotate={enableRotation}
					autoRotateSpeed={rotationSpeed}
				/>
				<Suspense fallback={null}>
				<Environment
					background={true}
					preset={'sunset'}
				/>
					<mesh>
					<Model />
				</mesh>
				</Suspense>
			</Physics>
		</Canvas>

[ashleymvanduzer]

you seem to be wrapping your model in a mesh. im guessing this is just a simple rundown of your code, but if this is a copy paste, and if that is a gltfjsx made component, that might be the issue. in this case what you are requesting help with, a code sandbox would be quite helpful :)

[drcmda]

try updating your dependencies especially threejs. data-utils missing sounds like something that threejs removed or displaced.