How to use Gamma Correction Pass?

🌵 Needle Engine
1

I have been using Unreal Bloom pass from ‘three/examples/jsm/postprocessing/UnrealBloomPass.js’ and noticed it really messes with the linear colour space and makes textures look awful. I googled around and saw other people mention needing to use Gamma Correction pass to fix it https://discourse.threejs.org/t/srgbencoding-with-post-processing/12582/2

But when using the attached sample script I made, I get this error:

Uncaught SyntaxError: The requested module '/node_modules/.vite/deps/three_examples_js_postprocessing_Shaderpass__js.js?v=9759ed6b' does not provide an export named 'default' (at PostProcessing.ts:5:1)

PostProcessing.ts

Original Post on Discord

by user 103054507105067008

2

I have tried
import ShaderPass from 'three/examples/js/postprocessing/Shaderpass';
import ShaderPass from 'three/examples/js/postprocessing/Shaderpass.js';

by user 103054507105067008

3

oh and also tried renaming the import to ‘ShaderPass.js’ as I made a typo changing it, same error :frowning_with_open_mouth:

by user 103054507105067008

4

Works from import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass.js'; instead of the /js/ version, I was trying to use the wrong example

by user 103054507105067008

5

Not actually working in the scene though so I’ll keep pluggin at it

by user 103054507105067008

6

/js/ folder is deprecated / shouldn’t be used from modules, yeah
I believe in latest three it actually will be deleted entirely.

7

That will be a relief

by user 103054507105067008

8

Gamma correction pass does actually work but it causes the same colorspace issues that the UnrealBloom pass caused so I’m still investigating

by user 103054507105067008

9

This is the horrible, 2 year old not fixed still issue I hit with colour banding - happens with Bloom Pass and Gamma Correction pass when I try using either!
https://discourse.threejs.org/t/subtle-colour-banding-issue-looks-like-256-colours-when-using-bloom-with-effect-composer/31174/2

by user 103054507105067008

10

To wrap this up, it is recommended to use https://github.com/pmndrs/postprocessing instead of the three.js examples stuff if you hit colour banding issues with post processing, sample is here:
https://discord.com/channels/717429793926283276/1054785738564190338/1054804210178334721

by user 103054507105067008