小编Sté*_*ese的帖子

我正在使用 AFrame 制作 360 全景查看器，并制作了一个自定义组件来使用天空的立方体贴图。

具有 6 个立方体面的纹理由 THREE.CubeTextureLoader 加载，然后我执行以下代码。

var shader = THREE.ShaderLib['cube'];
shader.uniforms['tCube'].value = texture;

var skyBoxMaterial = new THREE.ShaderMaterial({
    fragmentShader: shader.fragmentShader,
    vertexShader: shader.vertexShader,
    uniforms: shader.uniforms,
    depthTest: false,
    side: THREE.BackSide,
    transparent: true
});

var size = 1000;
var skyBoxGeometry = new THREE.CubeGeometry(size, size, size);

return new THREE.Mesh(skyBoxGeometry, skyBoxMaterial);

它使用 setObject3D 函数返回我在实体上使用的对象。

使用 AFrame 0.9.2 版（使用 v0.102.2 of Three），这段代码完美运行，我按预期得到了立方体。使用 1.0.1 版（使用 v0.111.5）时，我遇到了一个问题，因为 ShaderLib 被修改并且统一的 tCube 不再存在。我看到有一个 envMap 统一显然用于相同的目的但是当我在这个属性上设置我的纹理时，我在控制台中收到 WebGLProgram 着色器错误

index.js:27291 THREE.WebGLProgram: shader error:  0 35715 false gl.getProgramInfoLog invalid …