three.js: WebGL2 '#version 300 es' is not prepended when using RawShaderMaterials with 'defines' option
Description of the problem
When using RawShaderMaterial with the defines option, the #define definitions are prepended to the vertex/fragment program source code. However this becomes incompatible with WebGL2 shaders since the first line of these shader must be #version 300 es.
A proposed fix is to check for the #version XXX string as the first line and add the #define definitions after it.
Three.js version
- Dev
- r119
- r118
Browser
- All of them
- Chrome
- Firefox
- Internet Explorer
OS
- All of them
- Windows
- macOS
- Linux
- Android
- iOS
Hardware Requirements (graphics card, VR Device, …)
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Comments: 18 (8 by maintainers)
Commits related to this issue
- Fix for #19959. Add 'glslVersion' property to ShaderMaterial and prepend the version string when it's value is non-null. — committed to J-Rojas/three.js by J-Rojas 4 years ago
I’ve tested your PR in detail today and provided feedback here: https://github.com/mrdoob/three.js/pull/20005#issuecomment-674378445
Implementing the suggested code should make the PR ready to merge.