How to postprocessing load postprocess for three.js and then apply

I need help

How to asynchronous load postprocessing for three.js and then apply UnrealBloomPass?

I want to have a async separate chunk with postprocessing.js (and other libraries that I don't need at first). I use webpack 5.

When I do this, everything works well:

  let promiseA = Promise.all([
    { EffectComposer, EffectPass, RenderPass, ShaderPass, BloomEffect },
  ]) => {
    let composer = new EffectComposer(renderer);
    composer.setSize(canvas.width, canvas.height);
    composer.addPass(new RenderPass(scene, camera));

    let bloom = new BloomEffect();               
    bloom.intensity = 0.5;     
    const bloomEffect = new EffectPass(camera, bloom);

But when I try to use UnrealBloomPass, OutlinePass, SMAAPass... I get an error

    { EffectComposer, EffectPass, RenderPass, BloomEffect, UnrealBloomPass},

    console.log(UnrealBloomPass ); //undefined

Read more here:

Content Attribution

This content was originally published by Sladjan Ilic at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: