Registry / devops / vite-plugin-glslify

vite-plugin-glslify

JSON →
library2.3.0jsnpmunverified

A Vite plugin (v2.3.0, stable) that integrates glslify to compile GLSL shader code with #pragma glslify imports. It transforms tagged template literals (glsl`...`) and function calls (glsl(`...`)) in JavaScript/TypeScript files, as well as .glsl, .vert, .frag files. Ships TypeScript types. Unlike manual glslify CLI usage, it auto-plugs into Vite's dev server and build pipeline. Requires Vite ^5.2.9 || ^6.

devops
npm install vite-plugin-glslify
package ↗
INSTALL
IMPORT
SIG · VITE-PLUGIN-GLSLIF
V
vite-plugin-glslify
devopsjavascriptv2.3.0
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.

glslify (default)
✓ import glslify from 'vite-plugin-glslify'
ESM default import; works with TypeScript.
glslify (named)
✓ import { glslify } from 'vite-plugin-glslify'
✗ const glslify = require('vite-plugin-glslify')
ESM-only package; CommonJS require will fail.
DEFAULT_EXTENSIONS
✓ import { DEFAULT_EXTENSIONS } from 'vite-plugin-glslify'
Useful for extending the default file extensions.
glslify function as plugin entry
✓ import glslify from 'vite-plugin-glslify'; export default { plugins: [glslify()] }
✗ import { glslify } from 'vite-plugin-glslify'; export default { plugins: [glslify] }
glslify() returns a Plugin[] array, not a single plugin object.

Configures vite-plugin-glslify with include/exclude patterns, options for transforming tagged literals and files, and passes transforms to glslify.

// vite.config.js import { defineConfig } from 'vite'; import glslify from 'vite-plugin-glslify'; export default defineConfig({ plugins: [glslify({ include: [/src\/.*\.(ts|js)$/], exclude: ['node_modules/**'], transformLiterals: true, transformFiles: true, extensions: [/\.vert$/, /\.frag$/, /\.glsl$/], options: { transforms: [ ['glslify-hex', {}] ] } })] });
Debug
Known issues
breakingv1 to v2: peer dependency changed from vite@^2 to vite@^5||^6, plugin options restructured (funcName, options object).
fix
Update to vite-plugin-glslify@^2.0.0 and adjust vite.config.js to match new Options interface.
affects: <2.0.0
gotchaThe plugin returns an array of plugins (Plugin[]), not a single plugin. Using as a single plugin will cause Vite to ignore it.
fix
Spread the result or assign directly: glslify() returns an array; Vite accepts arrays in plugins.
affects: >=2.0.0
gotchaTagged template literals are only transformed if transformLiterals is true (default). If you disable it, `glsl` tagged templates will remain unchanged.
fix
Set transformLiterals: true or remove the option to use default.
affects: >=2.0.0
deprecatedThe `funcName` option defaults to /glsl/ matching any function named glsl, but using a string like 'glsl' may match unintended functions in older versions.
fix
Use a regex pattern in funcName, e.g., /^glsl$/.
affects: <2.0.0
Errors
Common errors & fixes
Cannot find module 'vite-plugin-glslify'
Package not installed or used in a CommonJS project (require).
fix
npm install vite-plugin-glslify --save-dev and use ESM imports (import).
TypeError: glslify is not a function
Named import used incorrectly; the plugin function is exported as default and named.
fix
Use import glslify from 'vite-plugin-glslify' or import { glslify } from 'vite-plugin-glslify'.
The requested module 'vite-plugin-glslify' does not provide an export named 'glslify'
Importing 'glslify' as a named export from a version that only exports default (pre-v2).
fix
Use default import: import glslify from 'vite-plugin-glslify'.
Upgrade
Version history
2.3.0latest on npm
Audit
Dependencies
viterequiredPeer dependency for the Vite plugin system
Agent activity
0 hits · last 30 days

No traffic data recorded yet.

Resources
packagehttps://www.npmjs.com/package/vite-plugin-glslify ↗
vite-plugin-glslify — npm install vite-plugin-glslify · libregistry