Javascript 编译顶点着色器时出错:错误:0:1:'/';:语法错误

Javascript 编译顶点着色器时出错:错误:0:1:'/';:语法错误,javascript,webgl,Javascript,Webgl,我在着色器方面遇到了问题,我是WebGL的新手。我找了几个小时的错误,就是找不到。我遵循一个教程,并将我的代码与教程作者的代码进行了比较,它完全匹配,他的代码在他的演示中运行良好,但由于某些原因没有在我的代码上运行。这是我的Javascript。它产生的错误是控制台中的“错误编译顶点着色器:错误:0:1:“/”:语法错误”,基本上表示无法编译着色器。任何帮助都将不胜感激 // Vertex Shader Code var vertexShaderText = [ 'precision mediu

我在着色器方面遇到了问题,我是WebGL的新手。我找了几个小时的错误,就是找不到。我遵循一个教程,并将我的代码与教程作者的代码进行了比较,它完全匹配,他的代码在他的演示中运行良好,但由于某些原因没有在我的代码上运行。这是我的Javascript。它产生的错误是控制台中的“错误编译顶点着色器:错误:0:1:“/”:语法错误”,基本上表示无法编译着色器。任何帮助都将不胜感激

// Vertex Shader Code
var vertexShaderText = [
'precision mediump float;',
'',
'attribute vec2 vertPosition;',
'',
'void main() {',
'   gl_Position = vec4(vertPosition, 0.0, 1.0);',
'}'
].join('/n');


// Fragment Shader Code
var fragmentShaderText = [
'precision mediump float;',
'',
'void main() {',
'   gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0);',
'}'
].join('/n');


var initApp = function() {

    // Check for errors
    console.log("The app is working so far");

    var canvas = document.getElementById('game-canvas'); 
    var gl = canvas.getContext('webgl');

    if (!gl) {
        gl = canvas.getContext('experimental-webgl');
    }

    if (!gl) {
        alert('Sorry, your web browser does not support WebGL. Please try opening this page in a different browser.');
    }

    // Clear color and depth buffers and set the background window color
    gl.clearColor(0.3, 0.7, 0.5, 0.7);
    gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);

    // Create vertex and fragment shader objects
    var vertexShader = gl.createShader(gl.VERTEX_SHADER);
    var fragmentShader = gl.createShader(gl.FRAGMENT_SHADER);

    // Load and compile shaders from code provided in 'vertexShaderText' and 'fragmentShaderText'
    gl.shaderSource(vertexShader, vertexShaderText);
    gl.shaderSource(fragmentShader, fragmentShaderText);

    gl.compileShader(vertexShader); 
    gl.compileShader(fragmentShader);

    // Check for GL compilation errors (because they often are not explicit)
    if (!gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS)) {
        console.error('Error compiling vertex shaders:', gl.getShaderInfoLog(vertexShader));
    }
    if (!gl.getShaderParameter(fragmentShader, gl.COMPILE_STATUS)) {
        console.error('Error compiling fragment shaders:', gl.getShaderInfoLog(fragmentShader));
    }
};

你可能想要
[…].join('\n')
而不是
'[…].join('/n')
瓦克雅斯珀说的是真的。我想我应该指出,这意味着你应该能够做到这一点

var vertexShaderText = `
precision mediump float;

attribute vec2 vertPosition;

void main() {
   gl_Position = vec4(vertPosition, 0.0, 1.0);
}
`;

// Fragment Shader Code
var fragmentShaderText = `
precision mediump float;

void main() {
   gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0);
}
`;
值得注意的例外是IE11