An esbuild plugin that adds support for .frag, .vert, .glsl and .wgsl file imports with optional shader minification.

npm install esbuild-plugin-glsl

import { build } from "esbuild";
import { glsl } from "esbuild-plugin-glsl";

build({
	entryPoints: ["input.js"],
	outfile: "output.js",
	bundle: true,
	plugins: [glsl({
		minify: true
	})]
}).catch(() => process.exit(1));

To make the TypeScript compiler know how to handle shader sources, add a shaders.d.ts file to your project:

declare module "*.wgsl" {
	const value: string;
	export default value;
}

declare module "*.glsl" {
	const value: string;
	export default value;
}

declare module "*.frag" {
	const value: string;
	export default value;
}

declare module "*.vert" {
	const value: string;
	export default value;
}

Use the issue tracker to propose and discuss changes. Maintain the existing coding style. Lint and test your code.