Unable to compile effect - shader compilation error - html shown in output of vertex code

Hi, I’ve upgraded to the latest release 5.0.0-alpha.65, and am encountering some errors in the console, output from Effect._processCompilationErrors

Weirdly, the html of my page is shown in the output of the vertex code. Not sure if this is a bug or something that’s changed that I need to fix in the new version/s, my app worked fine in bjs 4.

Output in console:

Thanks!

your shader code contains html which seems to mean it is trying to download it from a server for some reasons :expressionless:

Could you provide a repro of the issue ? I can not think of any related changes so far

Yep, my dev server responds to unknown routes with the index - I should have thought to check network logs :slight_smile:

The two shaders being requested are http://localhost:3000/src/Shaders/postprocess.vertex.fx and http://localhost:3000/src/Shaders/rgbdDecode.fragment.fx

It seems a glb import is the culprit, being imported like so:

SceneLoader.ImportMesh(
	"",
	`/static/models/basic_char.glb`,
	null,
	scene,
	(meshes, particleSystems, skeletons, animationGroups) => {
             ...
       })

Though I wasn’t able to reproduce in the playground :confused:

This is the initiator for both:

Anyway, if nothing is obvious from this, I’ll have more of a dig tomorrow

Yup this is like the RGBDPostProcess shader is not part of your package for some reasons … I can not think about why :frowning: If you can share a git repo or equivalent I can have a look

Is there some file that has the side effect of adding the shaders to the shaderstore? I tried to dig into the code but couldn’t find where this is done. The shaders themselves seem to be included, a breakpoint I set inside the generated rgbdDecode.fragment.js is being hit.

The shader store only has 4 shaders, which doesn’t seem quite right:

image

I’m also getting the same issue with the following shaders:

image

I can add you to my repo, but setup of the project isn’t the quickest - let me know if anything pops out from the above info

I’ve been able to fix this with import "@babylonjs/core/Materials/PBR/pbrBaseMaterial"

w000t this is strange cause if you have a pbr material in your scene this import "@babylonjs/core/Materials/PBR/pbrBaseMaterial" should happen for you :frowning: but I am glad it is working now.

Maybe I can help debug, where should that come in from? As I don’t see it at the top level of any of the gltf files

But perhaps it is caused by my quite selective importing of

import "@babylonjs/loaders/glTF/2.0"
import "@babylonjs/loaders/glTF/glTFFileLoader"
import "@babylonjs/loaders/glTF/glTFValidation"

in an attempt to reduce package size

the gltf files imports pbrMaterial files which are importing the base one hence why I am not understanding it.

2 Likes

Oh yes, indeed - that is confusing. Well, perhaps some setup issues in my project, good it is fixed now

Thanks for the help :slight_smile:

1 Like

Could you please explain your setup changes. Sometimes it works for me.


it is a react project .

If I recall correctly (a pretty big if) I have a peer dependency which was code split at the time. For whatever reason, side effects would / wouldn’t take effect depending on whether I imported them inside the peer dependency or my main codebase.

I never really got to the bottom of it but try moving the imports around - writing it out sounds like it was an ordering issue

2 Likes

Had another ShaderStore issue and got to the bottom of it this time.

I have a dependency which has a peerDependency of babylon in its package.json. My main package also has babylon as a dependency. Babylon was installed in the node_modules folder of both my main package and the dependency. This meant sometimes two separate copies of the same file were being included and ran in the final build.

In this case, it was shaderStore.js from both my package and the dependency being included. This meant there were two ShaderStore objects and two ShaderStore.ShadersStore objects.

The fix was just to delete the installed babylon in my dependencies node_module’s folder which let npm always resolve to the babylon in my main package’s node_modules folder.

1 Like

Thanks for letting us know as it is definitely not obvious and can help somebody else.

1 Like