Broccoli WebGL Transpiler

0.0.1 verified Fri May 01 auth: no javascript

A Broccoli plugin that transpiles WebGL/GLSL source files into JavaScript strings. Version 0.0.1 is the initial and only release. As a minimal plugin, it simply compiles GLSL files into exported JS strings and renames them from `.glsl` to `.js`. It does not handle shader attachment or compilation at runtime. Compared to alternatives like `ember-cli-webgl`, it is lower-level and lacks Ember-specific integration. The project appears to be early-stage with limited adoption.

Common errors

error TypeError: WebGLTranspiler is not a constructor ↓

cause Using require without .default when the package uses default export.

fix

const WebGLTranspiler = require('broccoli-webgl-transpiler').default;

error Error: Input tree must be a Broccoli node ↓

cause Passing a string path instead of a Broccoli node.

fix

Use broccoli.source or similar to create a tree from directory.

Warnings

gotcha Plugin only renames .glsl files to .js and compiles GLSL to exported JS strings; you must attach and compile shaders manually. ↓

fix Use higher-level library like ember-cli-webgl for automated shader compilation.

deprecated The npm package name 'broccoli-webgl-transpiler' has low download count and no recent updates; consider alternatives. ↓

fix Switch to actively maintained Broccoli plugin for GLSL.

Install

npm install broccoli-webgl-transpiler

yarn add broccoli-webgl-transpiler

pnpm add broccoli-webgl-transpiler

Imports

default
wrong
```
const WebGLTranspiler = require('broccoli-webgl-transpiler').default;
```
correct
```
import WebGLTranspiler from 'broccoli-webgl-transpiler';
```
The package uses a default export. The require example in the README uses .default, but for ESM simply import default.

WebGLTranspiler

wrong

const WebGLTranspiler = require('broccoli-webgl-transpiler');

correct

import { WebGLTranspiler } from 'broccoli-webgl-transpiler';

Named export is not available; only default export exists.

type BroccoliWebGLTranspilerOptions
```
import type { BroccoliWebGLTranspilerOptions } from 'broccoli-webgl-transpiler';
```
TypeScript types are not provided; this import is hypothetical.

Quickstart

Shows basic usage of broccoli-webgl-transpiler with a Broccoli tree.

const WebGLTranspiler = require('broccoli-webgl-transpiler');
const inputTree = 'path/to/glsl/files';
const webGLTree = new WebGLTranspiler(inputTree, {
  annotation: 'compile my shaders'
});
// Then use webGLTree as input to another Broccoli plugin or build pipeline.