How do you get syntax highlighting in Visual Studio Code in string literal for glsl shader?

1.6k Views Asked by At

I'm using Regl which integrates glsl vertex and fragment shaders as strings within a javascript file. I'd like to have syntax highlighting in Visual Studio Code apply to the glsl code within the strings, e.g.:

var regl = createREGL();

var drawTriangle = regl({

  // fragment shader
  frag: \` // want to apply syntax higlighting to code within string
  precision mediump float;
  uniform vec4 color;
  void main () {
    gl_FragColor = color;
  }`,
...
1

There are 1 best solutions below

1
On BEST ANSWER

There is a plugin for Visual Studio Code that mostly accomplishes this task: vscode-glsl-literal. You can search for it within Visual Studio Code and install it there. It only matches these template literals: glsl, glslify, frag, or vert. If your code doesn't use one of those (like regl), then add a comment before the string literal with glsl in it, like so:

frag: /*glsl*/`