Error in shader Material R3F: Cannot read properties of undefined (reading 'morphAttributes')

Questions
,
1

Hello,

I came back to an old code, and since the update of the packages this one does not work anymore, I tried to isolate the error and it seems to come from the shaderMaterial.

I get the following error:

Uncaught TypeError: Cannot read properties of undefined (reading ‘morphAttributes’)
at Object.getParameters

Here is the code:

const GrassMaterialFar = shaderMaterial(
  {
    bladeHeight: 0.6,
    map: null,
    time: 0,
    tipColor: new THREE.Color(0.0, 0.6, 0.0).convertSRGBToLinear(),
    bottomColor: new THREE.Color(0.0, 0.1, 0.0).convertSRGBToLinear(),
  },
  vertexFragmentFar,
  fragmentShaderFar,
  (self) => {
    self.side = THREE.DoubleSide;
  }
);

extend({ GrassMaterialFar });

And I use it like this:

// HACK to share material across all instances
  const [materialFarRefCurrent, materialFarRef] = useState();

  useFrame((state) => {
    materialFarRefCurrent.uniforms.time.value = state.clock.elapsedTime / 4;
  });

  return (
    <>
      <grassMaterialFar ref={materialFarRef} map={texture} toneMapped={false} />
      {materialFarRefCurrent &&
        POSITION_LIST.map((position, i) => {
      ...
        })}
    </>
  );
2

with the code you posted i don’t think the error can be found, it’s too little. maybe you can compare notes with this one Grass shader - CodeSandbox

1 Like
3

Ok, I found the source of the error.

I had an "Preload/> in another part of the code, it worked when I removed it.