Custom Shader TypeError: undefined is not an object (evaluating 'this.uniforms[this.textureID]')

I’m using three.js with Node. And am still learning so right now I’m trying to make my own effect that goes over the entire scene.

When I use the DotScreenShader from the examples folder the resulting shader shows up fine.
Importing with:

import { DotScreenShader } from ‘three/examples/jsm/shaders/DotScreenShader.js’;

But when I copy the exact code from ‘DotScreenShader.js’ to my own file with the className renamed to grainPass:

I get the following error:

undefined is not an object (evaluating ‘this.uniforms[this.textureID]’)

Here’s how I’m using the composer and passes:

this.composer    = new EffectComposer(this.renderer);
this.composer.setSize(this.width, this.height);
const renderPass = new RenderPass(this.scene,;

const grainPass  = new ShaderPass(grainShader);
//const grainPass  = new ShaderPass(DotScreenShader); // FOR TESTING This works shader!

In my render() function I’m updating the composer. Keeping this and commenting out the grainShader line my threejs scene renders just fine, the only error I have right now is when trying to use a direct copy of any of the example shaders.

I’v been trying and searching for many many hours (seriously it’s a sick joke) to see what I’m doing wrong, but the error above gets no results, and it makes no sense to me why the exact same code won’t work.