{"id":25344,"library":"esbuild-plugin-glslify-inline","title":"esbuild-plugin-glslify-inline","description":"An esbuild plugin that transforms inline GLSL template literals tagged with `glsl` from glslify into resolved shader code at build time. Version 1.1.0 is the current stable release with an optional minify flag. It integrates esbuild's bundling pipeline, applying glslify to inline shader strings so you can use `#pragma glslify: require(...)` inside JavaScript/TypeScript source files. Unlike separate file processing, this plugin keeps shaders co-located with code. Requires glslify as a peer dependency and node >= 12. Actively maintained.","status":"active","version":"1.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/marcofugaro/esbuild-plugin-glslify-inline","tags":["javascript","esbuild","plugin","esbuild-plugin","glslify","glsl","inline","typescript"],"install":[{"cmd":"npm install esbuild-plugin-glslify-inline","lang":"bash","label":"npm"},{"cmd":"yarn add esbuild-plugin-glslify-inline","lang":"bash","label":"yarn"},{"cmd":"pnpm add esbuild-plugin-glslify-inline","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency for processing GLSL imports and transforms","package":"glslify","optional":false},{"reason":"used internally to bundle shader dependency graphs","package":"glslify-bundle","optional":false},{"reason":"used internally to resolve local and package-based GLSL dependencies","package":"glslify-deps","optional":false}],"imports":[{"note":"The package exports a named function. CommonJS require works but TypeScript types may not resolve correctly in some setups.","wrong":"const glslifyInline = require('esbuild-plugin-glslify-inline')","symbol":"glslifyInline","correct":"import { glslifyInline } from 'esbuild-plugin-glslify-inline'"},{"note":"There is no default export; only named export 'glslifyInline' exists.","wrong":"import glslifyInline from 'esbuild-plugin-glslify-inline'","symbol":"default import","correct":"import { glslifyInline } from 'esbuild-plugin-glslify-inline'"},{"note":"Options interface is exported as a type for TypeScript users. Use `import type` to avoid runtime errors.","wrong":"import { GlslifyInlineOptions } from 'esbuild-plugin-glslify-inline'","symbol":"type import","correct":"import type { GlslifyInlineOptions } from 'esbuild-plugin-glslify-inline'"}],"quickstart":{"code":"// build.mjs\nimport { build } from 'esbuild'\nimport { glslifyInline } from 'esbuild-plugin-glslify-inline'\n\nawait build({\n  entryPoints: ['src/index.js'],\n  outfile: 'dist/bundle.js',\n  bundle: true,\n  plugins: [glslifyInline()],\n  format: 'esm',\n})\n\n// src/index.js\nimport glsl from 'glslify'\n\nconst shader = glsl`\n  #pragma glslify: noise = require(glsl-noise/simplex/3d)\n  uniform float time;\n  void main() {\n    float n = noise(vec3(uv, time));\n    gl_FragColor = vec4(n, 0.0, 0.0, 1.0);\n  }\n`\nconsole.log(shader)","lang":"javascript","description":"Shows how to configure esbuild with the plugin and use glslify to inline a GLSL shader that imports a noise function from npm package."},"warnings":[{"fix":"Install glslify as a dev dependency: npm install --save-dev glslify","message":"Requires peer dependency glslify installed. Missing glslify causes 'Cannot find module' error at build time.","severity":"breaking","affected_versions":">=1.0"},{"fix":"Ensure all inline shader code is inside glsl`...` tagged templates imported from 'glslify'.","message":"The plugin only transforms tagged template literals with the `glsl` tag. Other methods of inlining GLSL (like raw strings) are not processed.","severity":"gotcha","affected_versions":">=1.0"},{"fix":"Use the documented `#pragma glslify: require(...)` syntax for importing GLSL modules.","message":"glslify will only resolve `#pragma glslify: require(...)` calls. Plain `#include` or custom pragmas are ignored.","severity":"gotcha","affected_versions":">=1.0"},{"fix":"Upgrade to v1.1.0 to use the minify option: npm install esbuild-plugin-glslify-inline@latest","message":"The `minify` option is new in v1.1.0; earlier versions do not support it. Using `minify` with v1.0.0 will silently fail or cause build errors.","severity":"deprecated","affected_versions":"<=1.0.0"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"npm install --save-dev glslify","cause":"glslify peer dependency is not installed.","error":"Error: Cannot find module 'glslify'"},{"fix":"Use `import { glslifyInline } from 'esbuild-plugin-glslify-inline'`","cause":"Incorrect import: using default import instead of named import.","error":"TypeError: glslifyInline is not a function"},{"fix":"Use glsl tag: `import glsl from 'glslify'; const shader = glsl´...´`","cause":"Trying to import a .glsl file instead of using inline tagged templates. The plugin does not handle file imports.","error":"Error: No loader is configured for \".glsl\" files"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}