Registry / devops / glsl-transpiler2

glsl-transpiler2

library1.8.6jsnpmunverified

Transforms GLSL shader source code into optimized JavaScript. Version 1.8.6 is stable, though the package has seen infrequent updates since 2018. It converts vectors and matrices to arrays, expands swizzles, applies expression optimizations, and provides a stdlib for environment compatibility. Part of the stackgl ecosystem, it is a key tool for running WebGL shaders on the CPU or in headless environments. Differs from alternatives like glsl.js by offering more granular control over uniform/attribute replacement and stream-based processing.

devops

npm install glsl-transpiler2

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · GLSL-TRANSPILER2

glsl-transpiler2

devopsjavascriptv1.8.6

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

default

✓ import GLSL from 'glsl-transpiler'

✗ const GLSL = require('glsl-transpiler')

ESM since v1.8.0. CJS require still works but is deprecated.

default

✓ import compileStream from 'glsl-transpiler/stream'

✗ const compileStream = require('glsl-transpiler/stream')

Stream module available at subpath. Use ESM imports for tree-shaking.

Compiler

✓ import { Compiler } from 'glsl-transpiler'

✗ const { Compiler } = require('glsl-transpiler')

Named export Compiler is also available as default. Prefer named import for clarity.

Compiles a simple GLSL vertex shader to JavaScript with custom uniform/attribute mappings.

import GLSL from 'glsl-transpiler'; const compile = GLSL({ uniform: (name) => `uniforms.${name}`, attribute: (name) => `attributes.${name}` }); const result = compile(` precision mediump float; attribute vec2 uv; attribute vec4 color; varying vec4 fColor; uniform vec2 uScreenSize; void main(void) { fColor = color; vec2 position = vec2(uv.x, -uv.y); position.x *= uScreenSize.y / uScreenSize.x; gl_Position = vec4(position, 0, 1); } `); console.log(result);

Debug

Known issues

deprecatedThe `blend` option and related blending functionality are deprecated and may be removed in future versions.

fix

Remove usage of `blend` option. Use custom uniform/attribute replacements instead.

affects: >=1.7.0

breakingIn version 1.8.0, the package switched to ESM as the primary module format. CommonJS require still works but may not be supported indefinitely.

fix

Migrate imports to ES modules: `import GLSL from 'glsl-transpiler'`.

affects: >=1.8.0

gotchaUniform replacement function receives the uniform name as a string, not the full node object. The node parameter is only provided if the function signature accepts two arguments.

fix

Use function with two parameters if you need node: `uniform(name, node)`.

affects: >=1.0.0

deprecatedThe `source-map` option (with hyphen) has been deprecated in favor of `sourceMap` (camelCase).

fix

Change option name to `sourceMap`.

affects: >=1.6.0

gotchaThe `version` option accepts only '100 es' or '300 es'. Setting an unsupported version will silently fall back to default.

fix

Ensure version string is exactly '100 es' or '300 es'.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Expected GLSL version string, got undefined

Missing or misspelled `version` option in compiler creation.

fix

Provide version option: `GLSL({ version: '100 es' })`.

TypeError: compile is not a function

Importing incorrectly; the default export is a factory function, not a compiler directly.

fix

Call the default export: `const compile = GLSL(options); compile(source)`.

SyntaxError: Unexpected token '='

Attempting to assign to uniform or attribute without using a replacement function.

fix

Provide uniform and attribute options: `GLSL({ uniform: name => 'uniforms.' + name })`.

Upgrade

Version history

1.8.6latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

12 hits · last 30 days

node

Resources

githubhttps://github.com/stackgl/glsl-transpiler ↗

packageglsl-transpiler2 ↗

homepagehttps://github.com/stackgl/glsl-transpiler#readme ↗