{"id":22043,"library":"rollup-plugin-glslify","title":"rollup-plugin-glslify","description":"A Rollup plugin that allows importing GLSL shader files (e.g., .glsl, .vert, .frag) as JavaScript strings, processed through glslify — a Node.js-style module system for GLSL. It supports include/exclude patterns, optional compression via glslify's minifier, and is TypeScript-compatible (ships types). Current stable is 1.3.1, with maintenance releases as needed. Differentiators: integrates glslify's modular shader system into Rollup builds, supports compression, and is part of the glslify ecosystem. Compared to raw string loaders, it resolves glslify imports and applies transforms.","status":"active","version":"1.3.1","language":"javascript","source_language":"en","source_url":"https://github.com/glslify/rollup-plugin-glslify","tags":["javascript","rollup","plugin","glsl","glslify","shaders","typescript"],"install":[{"cmd":"npm install rollup-plugin-glslify","lang":"bash","label":"npm"},{"cmd":"yarn add rollup-plugin-glslify","lang":"bash","label":"yarn"},{"cmd":"pnpm add rollup-plugin-glslify","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency; plugin is designed for Rollup ≥0.60","package":"rollup","optional":false},{"reason":"core dependency; performs GLSL module resolution and transforms","package":"glslify","optional":false}],"imports":[{"note":"ESM export only; named exports are not provided.","wrong":"const glslify = require('rollup-plugin-glslify')","symbol":"default","correct":"import glslify from 'rollup-plugin-glslify'"},{"note":"The package exports a single default function, not a named export.","wrong":"import { glslify } from 'rollup-plugin-glslify'","symbol":"glslify","correct":"import glslify from 'rollup-plugin-glslify'"},{"note":"TypeScript users: use default import. The module is declared with 'export default' in its types.","wrong":"import * as glslify from 'rollup-plugin-glslify'","symbol":"glslify with TypeScript","correct":"import glslify from 'rollup-plugin-glslify'"}],"quickstart":{"code":"// rollup.config.js\nimport glslify from 'rollup-plugin-glslify';\nimport { defineConfig } from 'rollup';\n\nexport default defineConfig({\n  input: 'src/index.js',\n  output: { dir: 'dist', format: 'es' },\n  plugins: [glslify({\n    include: ['**/*.glsl', '**/*.vert', '**/*.frag'],\n    exclude: 'node_modules/**',\n    compress: true // default: minify\n  })]\n});\n\n// src/index.js\nimport frag from './shaders/example.frag';\nconsole.log(frag); // GLSL string","lang":"typescript","description":"Shows a Rollup config using the plugin with include/exclude and compression, plus importing a .frag file."},"warnings":[{"fix":"Update custom transforms to return a string directly instead of using through2.","message":"In v1.x, the plugin switched from glslify's older stream API to a newer sync API. Existing configs using custom transforms may break.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Set compress: false in development config, and only enable for production builds.","message":"The compress option still defaults to true, but glslify's built-in minifier may be slow for large shaders. Consider disabling compress in development.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Explicitly set include to only the extensions you need, e.g., include: ['**/*.glsl'].","message":"File extensions .vs, .fs, .vert, .frag, .glsl are included by default, but .vs and .fs may conflict with other asset loaders.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Manually add source map support via a separate Rollup plugin or use glslify's --sourcemap flag.","message":"The plugin does not produce source maps for the GLSL strings. Debugging compiled shaders may be difficult.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run 'npm install glslify' alongside rollup-plugin-glslify.","cause":"glslify is not installed or listed as a dependency.","error":"Error: Cannot find module 'glslify'"},{"fix":"Use default import: import glslify from 'rollup-plugin-glslify'","cause":"Wrong import style (named import) causing undefined.","error":"TypeError: glslify is not a function"},{"fix":"Add .glsl to the include option or verify the file extension matches the pattern.","cause":"The plugin is not processing the .glsl file because it's not included.","error":"Module parse failed: Unexpected token (1:0) in file shader.glsl"},{"fix":"Check the import path in the GLSL file and ensure it exists.","cause":"glslify's relative imports are resolved relative to the file, not the project root.","error":"Error: Could not resolve './common.glsl' from 'shader.vert'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}