Unable to use ShaderGradient in Next.JS 13 app

[Claudio Orlandi]

Hello, I'm trying to use the Shader Gradient in a Next.JS 13 app using App Routes, but I'm getting the same error as this other issue.

Can someone help me with an example or with a way to make it work with this structure?

I've tried to follow this example, but with App routes structure we don't have the Component as a prop on layout.tsx file.

[ruucm]

It looks also related to dependency issue.

I think we need to look more details, but here is a working version with Next.js 13 + App Routes.

https://codesandbox.io/p/sandbox/github/ruucm/shadergradient/tree/main/apps/example-nextjs-approuter

FYI: I changed two dependency version from https://github.com/pmndrs/react-three-next as below

• "@react-three/fiber": "8.9.1"
• "three": "0.150.0"

[Pallav Agarwal]

Pinning those two dependancies fixes the issue for me! Thanks 🙏

[ruucm]

thanks closing.