Hello there, I’m trying to replicate the screen space refraction exampe from three.js examples but can’t seem to properly import the SSR module, see my code here: Glitch :・゚✧ any help would be appreciated
You have some runtime errors in your glitch. Always inspect the browser console to avoid such obvious issues.
Uncaught ReferenceError: EffectComposer is not defined
When you import EffectComposer
as a global script, you can only access it over the THREE
namespace. So you need this:
composer = new THREE.EffectComposer(renderer);
You also don’t have dependent modules like CopyShader
or ShaderPass
imported in your app.
Probably better to use a ES6 module workflow like in the official examples to avoid these issue altogether.
When I do: “composer = new THREE.EffectComposer(renderer);” it says “THREE.EffectComposer is not a constructor” , what does this mean?
SSRrPass.js only has jsm
( es6 module, <script type="module">
) version now,
so please all use jsm
first, like in the example.
Next Three.js release ( at the end of this month ) will has js
version.
when I use <script type="module">
it says “Loading module from “https://shange-fagan.neocities.org/shaders/SSRShader.js” was blocked because of a disallowed MIME type (“text/html”)” what does this mean?
Seems https://shange-fagan.neocities.org/shaders/SSRShader.js is broken.
I’m not familiar with three.js cdn, please try https://cdn.skypack.dev/three@0.127.0/examples/jsm/postprocessing/SSRrPass?min ,
and the setup in this demo https://codepen.io/ycw/pen/jOyyGGX