shader通常的错误提示以及解决方法

1、WebGL目前最多支持哪个版本的shader？

Webgl目前最高版本是2.0，与之对应的是shader glsl es，目前该着色器更新到3.2版本。你只需要在shader最开始声明其版本就可以应用。

2、Webgl或者Threejs如何在应用拓展性shader？

首先在js中应用浏览器拓展，详见地址https://developer.mozilla.org/zh-CN/docs/Web/API/WebGLRenderingContext/getExtension

//webgl
gl.getExtension(name);
//threejs
renderer.context.getExtension('OES_standard_derivatives');

之后

在着色器中通过预处理指令引入拓展，片元和顶点若都要使用都需要引用，或者一个使用，另外提个通过varying传入也可以。

#extension  GL_OES_standard_derivatives : enable

最终应用偏导做运算

vec3 dx = dFdx(v_position);
vec3 dy = dFdy(v_position);

3、shader中类型转换错误，一般发生在当变量的数据类型不匹配时，会导致编译错误。关键词convert

ERROR: 0:1: 'varying float' :  cannot implicitly convert from 'int' to 'float'
ERROR: 0:1: 'varying vec4' :  cannot implicitly convert from 'vec3' to 'vec4'
ERROR: 0:1: 'uniform mat3' :  cannot implicitly convert from 'mat4' to 'mat3'
ERROR: 0:1: 'uniform samplerCube' :  cannot implicitly convert from 'sampler2D' to 'samplerCube'
ERROR: 0:233: '=' : cannot convert from 'highp float' to 'highp 3-component vector of float'

4、ERROR: 0:1: 'addLight' : no matching overloaded function found

这个错误和我们在js或者在.net中遇到的类似，就是调用的函数参数数量不匹配或参数类型不匹配的错误。

5、ERROR: 0:1: 'array[4]' : array index out of bounds

这个错误也非常明显，就是目前所看到的索引4，已经超出了array的数组范围，这时候你应该注意检索你的代码逻辑，一则是查看array数组内容和大小是否和预期的一致，二则是你的索引值的获取是否符合逻辑范围。

6、ERROR: 0:1: '#version' : version number not supported

Shader ES有不同的版本，如果在较旧的版本中使用了较新的语法，则会出现以上面错误，这时候需要我们去官方文档上查看相应的文档，寻找该版本下可以代替的其他版本或者升级shader es的版本。