power2d-codegen

Generate TypeScript shader modules from WGSL and GLSL sources.

4|Updated Jan 28, 2026

Search Tags:#typescript #glsl #wgsl #shader-codegen #babylon #power2d #shader-material

Ready to run

npx skills add https://github.com/AvneeshSarwate/avTools --skill power2d-codegen

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: power2d-codegen
Source: https://github.com/AvneeshSarwate/avTools/tree/main/skills/power2d-codegen
Command: npx skills add https://github.com/AvneeshSarwate/avTools --skill power2d-codegen

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The power2d-codegen Skill automates shader code generation by transforming WGSL and GLSL shader sources into TypeScript companion modules, reducing boilerplate and accelerating Babylon.js integrations.

Core Features & Use Cases

Generates TypeScript interfaces, setters, material factories, and metadata from Material/Stroke/Fragment/Compute shaders.
Outputs ready-to-use generated files that plug into a Babylon.js-based rendering pipeline and Power2D extensions.
Use Case: A developer writes a WGSL material shader and relies on the codegen to produce TypeScript bindings that configure a ShaderMaterial with typed uniforms.

Quick Start

Install or run the codegen workflow via the repository tooling. Then import the generated modules (e.g., "./animation.compute.wgsl.generated.ts") and instantiate materials or effects as needed.

Frequently Asked Questions about power2d-codegen

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I generate TypeScript bindings from WGSL shaders for Babylon.js?▼

You can generate TypeScript bindings from WGSL shaders by using a codegen tool that parses WGSL sources and outputs typed companion modules. This process reduces boilerplate by creating ready-to-use TypeScript interfaces and material factories for Babylon.js shader integration.

Can I automate ShaderMaterial boilerplate creation from GLSL in a Deno environment?▼

Yes, you can automate ShaderMaterial boilerplate creation from GLSL in a Deno environment. The codegen workflow transforms GLSL shader sources into TypeScript artifacts, generating typed uniform setters and metadata to configure Babylon.js materials without manual setup.

What is the best way to set up typed uniforms for a Babylon.js compute shader?▼

The best way to set up typed uniforms for a Babylon.js compute shader is to generate TypeScript companion modules from your source shaders. This approach automatically produces typed interfaces and setters, ensuring type safety and reducing manual configuration errors for compute paths.

Does Babylon.js shader codegen require external parsing dependencies for WGSL?▼

Yes, Babylon.js shader codegen requires the wgsl_reflect dependency for WGSL parsing. You need to install this library to accurately analyze WGSL source code and generate the corresponding TypeScript modules and shader metadata.

Why do I need to generate TypeScript metadata for fragment effects and materials?▼

You need to generate TypeScript metadata for fragment effects and materials to bridge the gap between raw shader code and the rendering pipeline. This automation outputs structured metadata that allows Power2D and Babylon.js to dynamically configure and instantiate materials.

Are there limitations when generating TypeScript modules from mixed WGSL and GLSL sources?▼

A key limitation when generating TypeScript modules from mixed WGSL and GLSL sources is that WGSL parsing specifically depends on the wgsl_reflect library. You must ensure your Deno environment has the correct dependencies configured to handle both shader languages effectively.