# JavaScript
Bundle a JavaScript game with esbuild and ship it to Wavedash.
Source: https://docs.wavedash.com/engines/javascript
The recommended setup is a small bundler (`esbuild`) plus the `@wvdsh/sdk-js` package — that gives you a real `import Wavedash from "@wvdsh/sdk-js"` and full editor autocomplete on every method, event, and payload. If you want to skip the build step entirely, see the [vanilla JS path](#vanilla-js-no-build-step) at the bottom of the page.
## Install dependencies
```bash
npm install @wvdsh/sdk-js
```
The default export is the live, fully-typed Wavedash SDK singleton.
## Setup
```
my-game/
├── wavedash.toml
├── package.json
├── src/main.js # source
└── web/
├── index.html # loads ./main.bundle.js
└── main.bundle.js # esbuild output (gitignored)
```
### `package.json`
```json
{
"name": "my-game",
"private": true,
"scripts": {
"build": "esbuild src/main.js --bundle --format=esm --target=es2022 --outfile=web/main.bundle.js"
},
"dependencies": {
"@wvdsh/sdk-js": "^1.3.0"
},
"devDependencies": {
"esbuild": "^0.24.0"
}
}
```
### `web/index.html`
```html
My Game
```
### `src/main.js`
**Calling `Wavedash.init()` is required.** Your game stays hidden behind the Wavedash loading screen until you do. Call it once your game is ready to play.
```javascript
import Wavedash from "@wvdsh/sdk-js";
const canvas = document.getElementById("gameCanvas");
const ctx = canvas.getContext("2d");
// Load assets in stages and report progress as you go.
Wavedash.updateLoadProgressZeroToOne(0);
await loadImages(); // e.g. fetch sprite sheets
Wavedash.updateLoadProgressZeroToOne(0.5);
await loadAudio(); // e.g. decode sound effects
Wavedash.updateLoadProgressZeroToOne(1);
Wavedash.init({ debug: true });
let last = performance.now();
(function loop(now) {
const dt = Math.min(0.05, (now - last) / 1000);
last = now;
update(dt);
draw();
requestAnimationFrame(loop);
})(last);
```
Call `updateLoadProgressZeroToOne(...)` with intermediate values during async asset loading. `init()` automatically signals load completion, so call it last.
### Build and run
```bash
npm install
npm run build
wavedash dev
```
## wavedash.toml
```toml
game_id = "YOUR_GAME_ID_HERE"
upload_dir = "./web"
```
## Vanilla JS, no build step
If your game is plain JavaScript and you'd rather skip the bundler, just use `window.Wavedash` directly — the host injects it before your code runs. Drop the `