# OIT module imports

**URL:** <https://forum.babylonjs.com/t/oit-module-imports/42690>\
**Category:** Questions\
**Created:** [July 25, 2023, 8:51am UTC](https://forum.babylonjs.com/t/oit-module-imports/42690 "2023-07-25T08:51:42Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![phaselock](https://avatars.discourse-cdn.com/v4/letter/p/da6949/32.png) [@phaselock](https://forum.babylonjs.com/u/phaselock)\
**Post date:** [July 25, 2023, 8:51am UTC](https://forum.babylonjs.com/t/oit-module-imports/42690/1 "2023-07-25T08:51:42Z")

</div>

Hi all, I wanted to implement OIT in Seedborn which didn’t exist back during dev. I think its a good test case with a lot of different types of meshes with post. I tested on PG with the individual meshes and they seem to work fine. So I plunged ahead with `this.scene.useOrderIndependentTransparency = true;`

I’m using es6 modules (v6.13 for core + materials) and the first error I got was `this._scene.depthPeelingRenderer is undefined`

I added `import "@babylonjs/core/Rendering/depthPeelingSceneComponent.js";`

which gave `e.enablePrePassRenderer is not a function`.

I then added `import "@babylonjs/core/Rendering/prePassRendererSceneComponent.js";`

which gave `this._scene.disableGeometryBufferRenderer is not a function`

so I added `import "@babylonjs/core/Rendering/geometryBufferRendererSceneComponent.js";`

which threw `this._postProcessesSourceForThisPass is undefined`

And I realized I have run out of possible stuff to add from the Rendering src folder, I believe the error has to do with postProcess. Is there a doc somewhere that points to the modules for OIT? Kindly advise, thks!

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [July 25, 2023, 9:49am UTC](https://forum.babylonjs.com/t/oit-module-imports/42690/2 "2023-07-25T09:49:13Z")

</div>

`_postProcessesSourceForThisPass` is a private variable of `PrePassRenderer`, so I think the error doesn’t come from a missing import but appears during program execution.

If this is the case, I’m afraid it would be difficult to help you without some kind of reproduction…

---

<div class="post-metadata">

**Author:** ![carolhmj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/carolhmj/32/25918_2.png) [@carolhmj](https://forum.babylonjs.com/u/carolhmj)\
**Post date:** [July 25, 2023, 11:59am UTC](https://forum.babylonjs.com/t/oit-module-imports/42690/3 "2023-07-25T11:59:24Z")

</div>

You can take a look at the file structure on the github too: [Babylon.js/packages/dev/core/src/Rendering/depthRenderer.ts at master · BabylonJS/Babylon.js (github.com)](https://github.com/BabylonJS/Babylon.js/blob/master/packages/dev/core/src/Rendering/depthRenderer.ts)

---

<div class="post-metadata">

**Author:** ![phaselock](https://avatars.discourse-cdn.com/v4/letter/p/da6949/32.png) [@phaselock](https://forum.babylonjs.com/u/phaselock)\
**Post date:** [July 25, 2023, 12:35pm UTC](https://forum.babylonjs.com/t/oit-module-imports/42690/4 "2023-07-25T12:35:22Z")

</div>

I found a repro and possibly the cause of my error:

> **[Babylon.js Playground](https://playground.babylonjs.com/#UNGKGD%23212)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

water refraction texture doesn’t work with OIT, hrmm… ☹

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [July 25, 2023, 2:19pm UTC](https://forum.babylonjs.com/t/oit-module-imports/42690/5 "2023-07-25T14:19:38Z")

</div>

You should disable the prepass renderer for your custom target texture by doing `_refractionRTT.noPrePassRenderer = true;`:

> **[Babylon.js Playground](https://playground.babylonjs.com/#UNGKGD%23213)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![phaselock](https://avatars.discourse-cdn.com/v4/letter/p/da6949/32.png) [@phaselock](https://forum.babylonjs.com/u/phaselock)\
**Post date:** [July 26, 2023, 1:32am UTC](https://forum.babylonjs.com/t/oit-module-imports/42690/6 "2023-07-26T01:32:03Z")

</div>

well, the error goes away but the PG doesn’t show anything. Commenting out `scene.customRenderTargets.push(_refractionRTT);` works. But it broke other custom shaders in my game. ☹

Thanks for all the help, this experiment is kiv’ed indefinitely.  
Marking as solved, cheers!

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [July 26, 2023, 10:02am UTC](https://forum.babylonjs.com/t/oit-module-imports/42690/7 "2023-07-26T10:02:30Z")

</div>

A workaround is to enable OIT after a little time:

> **[Babylon.js Playground](https://playground.babylonjs.com/#UNGKGD%23217)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

Note however that the water mesh won’t be handled by OIT, as it is not flagged as transparent. You can set it as transparent by adding `needAlphaBlending: true` to the options of the `ShaderMaterial` constructor but that will fail, because the shader would have to handle the specificities of the prepass renderer (it needs to write to some specific render targets).
