Shadeup compiler tools

Installation

npm install -g @shadeup/cli

Usage

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

Example

// 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();
})();

Preview mode

$ 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.