npm install -g @shadeup/cli
shadeup --help
CLI tool for compiling shadeup files
Options:
-V, --version output the version number
-v
-h, --help display help for command
Commands:
build [options] <file> Build file
watch <file> Watch a shadeup file and recompile on change
preview <file> Live preview of a shadeup file in electron
// main.shadeup
fn main() {
draw(shader {
out.color = (in.uv, 0.5, 1.0);
});
}
$ shadeup build main.shadeup
After running the above command, you should find the following files in the same directory as main.shadeup
:
main.js
main.d.ts
You can use the above files inside of a vite or webpack project to use the shader in your web application.
$ npm i shadeup
// example.ts
import { makeShadeupInstance } from "./main";
const canvas = document.querySelector<HTMLCanvasElement>("#canvas")!;
(async () => {
const engine = await makeShadeupInstance(canvas);
// Optionally enable the UI
await engine.enableUI();
// The frame loop will start automatically
// You can call pub functions on the engine instance
// engine.files.main.exampleFunction();
})();
$ shadeup preview main.shadeup
This will open an electron window with the shader preview. You can use this to quickly test your shader without having to set up a web project.