Sage Connector Integration Guide

This guide explains how to install and use the sdk-javascript-bridge Node module in this Vite + React + Blazor WebAssembly bridge solution.

1. Install the sdk-javascript-bridge Node Module

If you have the .tgz package (for example, sdk-javascript-bridge-1.0.0.tgz), run:

npm install ./sdk-javascript-bridge

Or, if the package is in another directory:

npm install /path/to/sdk-javascript-bridge-1.0.0.tgz

2. Blazor Runtime Availability

The Blazor WebAssembly runtime and related files are inside the sdk-javascript-bridge package under:

These files must be available to the browser at /public/_framework/.

This solution includes a script (copy-sage-framework.cjs) and a Vite plugin that automatically copies these files to public/_framework before both dev and build.
You do not need to run the script manually.
It is triggered automatically by Vite.

3. Reference the Blazor Runtime in HTML

Your index.html must include:

This is required for the bridge to work.

4. Start the Dev Server

Run:

npm run dev

or

vite

The Blazor runtime will be available, and the bridge will work.

5. Usage

• The UI provides buttons to call static methods and test advanced method calls.
• The bridge logic is in bridge-tools.js.
• Debug output appears in the "Debug Information" panel.

6. Troubleshooting

• If you update or reinstall sdk-javascript-bridge, restart the dev server to ensure the latest files are copied.
• If you move the copy script, update the path in vite.config.js.
• If you see errors about missing _framework files, ensure the install and copy steps above are complete.

7. Project Structure

• copy-sage-framework.cjs — Copies Blazor files from the node module to public/_framework.
• vite.config.js — Runs the copy script automatically.
• bridge-tools.js — Main bridge logic for interacting with Blazor.
• index.html — Loads the Blazor runtime and bridge scripts.

You are ready to use the Sage Connector in your Vite + React project!