Search documentation

Find pages, sections, and content across all docs.

WavedashDocs

RPG Maker

Deploy RPG Maker MZ projects with the built-in Web browsers exporter.

View example project on GitHub Playtest the example project

This guide covers RPG Maker MZ. The UI paths and plugin APIs differ in earlier versions (MV, VX Ace, etc.) — the plugin code below is specific to MZ's JavaScript runtime.

RPG Maker MZ ships with a built-in Web deployment that outputs a folder of HTML, JS, and asset directories runnable directly in a browser. Wire up the Wavedash SDK through a plugin so it survives every re-deployment.

Export your game

  1. File → Deployment
  2. Platform: Web browsers / Android / iOS
  3. Output Path: a temp folder (you'll copy the result into the upload directory next)
  4. Click OK

RPG Maker MZ writes a <YourProject>/ folder inside the output path. That inner folder contains index.html, js/, data/, audio/, img/, effects/, fonts/, and css/. Copy or move it into build/ alongside your wavedash.toml.

SDK integration

Create a plugin at js/plugins/Wavedash.js inside your RPG Maker MZ project:

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.

//=============================================================================
// Wavedash SDK
//=============================================================================
/*:
 * @target MZ
 * @plugindesc Initializes the Wavedash SDK, exposes name-keyed score/achievement helpers,
 *             and enables canvas stretch-to-fit in web browsers.
 * @author Wavedash
 */
(() => {
    // RPG Maker MZ only stretches the canvas for mobile or nwjs by default,
    // leaving desktop-web builds locked at the native 816x624 resolution.
    // Override _defaultStretchMode so the canvas scales to the viewport.
    Graphics._defaultStretchMode = function () {
        return true;
    };

    const _Scene_Boot_start = Scene_Boot.prototype.start;
    Scene_Boot.prototype.start = function () {
        _Scene_Boot_start.call(this);
        try {
            window.Wavedash.updateLoadProgressZeroToOne(1);
            window.Wavedash.init({ debug: true });
        } catch (e) {
            console.warn("[wavedash] init failed:", e);
        }
    };

    const leaderboardIds = new Map();
    async function getLeaderboardId(name) {
        if (leaderboardIds.has(name)) return leaderboardIds.get(name);
        const res = await window.Wavedash.getLeaderboard(name);
        if (!res.success) throw new Error(`[wavedash] leaderboard "${name}" missing`);
        leaderboardIds.set(name, res.data.id);
        return res.data.id;
    }

    window.wavedashSubmitScore = async function (name, score) {
        const id = await getLeaderboardId(name);
        return window.Wavedash.uploadLeaderboardScore(id, score, true);
    };
    window.wavedashUnlockAchievement = function (id) {
        return window.Wavedash.setAchievement(id, true);
    };
})();

Then enable it: Tools → Plugin Manager → pick an empty row → Name: Wavedash → Status: ON → OK. RPG Maker MZ will include the plugin in every future Web deployment.

Without the Graphics._defaultStretchMode override, RPG Maker MZ's desktop-web builds don't resize with the browser window — the canvas stays pinned at 816x624 pixels. This one-line flip is the standard community workaround.

Calling the SDK from game events

The plugin exposes two window. helpers so a Script event command stays a one-liner:

wavedashUnlockAchievement("first_clear");

// Submit the value in variable slot 1 to the "high-scores" leaderboard
wavedashSubmitScore("high-scores", $gameVariables.value(1));

wavedash.toml

game_id = "YOUR_GAME_ID_HERE"
upload_dir = "./build"
entrypoint = "index.html"

The build/ directory is an RPG Maker MZ deployment output. Re-deploy (File → Deployment) after editing the project in the MZ editor, then replace build/ with the new output.