glslify / glslify/glslify-loader

Undocumented raw-loader bug

Open
#24 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
228
Forks
24
PR merge metrics
No merged PRs in 30d

Description

I noticed what appears to be a bug when using this syntax:

```js
import vertexShade from 'raw-loader!glslify-loader!./VertexShader.vert'
console.log(vertexShader)
```

would print
```js
#define GLSLIFY 1
export default "#define GLSLIFY 1\nvarying vec2 vUv;\nvoid main() {\n vUv = uv;\n gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n}";
```

Notice that it includes `#define GLSLIFY 1` twice, and `export default` which makes it invalid GLSL. This would cause the shader compilation to fail.

Here is my webpack config:

```js
rules: [
{
test: /\.(glsl|vs|fs|vert|frag)$/,
exclude: /node_modules/,
use: [
'raw-loader',
'glslify-loader'
]
},
]
```

### The Solution

I came across this in the documentation for raw-loader:

```
Beware, if you already define loader(s) for extension(s) in webpack.config.js you should use:

import css from '!!raw-loader!./file.txt'; // Adding `!!` to a request will disable all loaders specified in the configuration
```

When I added it to my code, it worked properly.

```js
import vertexShader from '!!raw-loader!glslify-loader!./VertexShader.vert'
console.log(vertexShader)
```
now prints:

```
#define GLSLIFY 1
varying vec2 vUv;
void main() {
vUv = uv;
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
}
```
Now the shader compiles successfully. Not sure if this was an issue in my configuration somehow, and I'm not sure what to title this issue, but hope it helps someone.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.