Creating Shader from NodeMaterialEditor

Hi,

im trying the following:

  1. Exporting Shaders from following NM:
    Babylon.js Node Material Editor

  2. splitting the vertex and fragment shader into two seperate files like said in the docs:
    customShader.fragment.fx
    customShader.vertex.fx

  3. importing the shader into my project with the following code:
    https://playground.babylonjs.com/#J0I63Q#1

However as you can see in the playground above, the Shader throws Errors.

My Question now is if i am doing anything wrong when importing or if it is a bug in the Node Material Editor ?

Thanks in Advance!

It is because some to the Defines are not setup as they should:

#ifdef UVTRANSFORM0
vec4 tempTextureRead5 = texture2D(NormalSampler, transformedUV);
#elif defined(VMAINOUTPUT5)
vec4 tempTextureRead5 = texture2D(NormalSampler, vMainoutput5);
#endif

basically none of those are true so tempTextureRead5 is not defined.

The material is pretty complex, I would not try manually recreating it.

Also, see my answer in this thread:

Ok, so i guess the easy way out is to use the node material directly like a shader, by just creating multiple references with different textures.

The problem here is that the Node Material seems to depend on the node material editor, which means I have to import another full package (@babylonjs/node-editor)
could i use tree shaking here / what do i need to import to just make the Material work?

But the bigger problem is that this package uses React with DevTools even in production/build.
Any possibility for me to change that?

No, you don’t need the node editor package to use node materials.

What is the error you get when not adding this package?

First the Scene loads with all Materials grey (no errors/warnings in the console):
image
And then after a react state update i get the following erors:


image

Oh i see that im probably wrong and this happens because of the mirror Texture on a Standard Material and not because of the Node Material. However i still don’t get why this error only appears when not importing the node editor.

It’s hard to say, the way of the bug is unfathomable!

If you are able to setup a repro it would help. Also, are you using scene.executeWhenReady to start the real work only when the scene is ready? It could help too.

Found the bug it was a Side Affect from using Tree Shaking, caused by importing the Shadow Generator directly from the file instead of the Folder @babylonjs/core/Lights/Shadows/.

And i guess importing the node editor resolved this issue because it indirectly imports the Shadows Folder as well ?

Anyway thanks for the help!

2 Likes