Electron on Windows Gallery

Electron on Windows Gallery is an Electron application which displays the range of native Windows functionality which can be accessed from Electron applications. It includes:

• Interactive samples powered by local AI models and the Windows SDK
• JavaScript sample code and API documentation
• Guides on getting started with Electron on Windows, building native addons, and more

Before you get started, ensure you have the following installed:

• Node.js - Required for npm package management
• Git - Required to clone the repository
• Visual Studio Build Tools - Required for building native modules
• Python - Required as a build dependency

You should also verify that your machine meets:

• Electron's system prerequisites
• Windows AI APIs system requirements

This project welcomes contributions and suggestions. Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit Contributor License Agreements.

When you submit a pull request, a CLA bot will automatically determine whether you need to provide a CLA and decorate the PR appropriately (e.g., status check, comment). Simply follow the instructions provided by the bot. You will only need to do this once across all repos using our CLA.

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.

1. If you're new to building Electron apps, make sure your machine meets Electron's system prerequisites.
2. If you're new to running Windows AI API's, make sure your machine meet the system requirements for Windows AI API's.

git clone https://github.com/microsoft/electron-on-windows-gallery.git

Before building the app locally, you'll need to create a .env file for Windows AI Limited Access Features:

# Create a .env file in the root of the repository with your LAF token
LAF_TOKEN=your_laf_token_here

cd <path to electron-on-windows-gallery repo>
npm install
npx winapp restore
npx winapp cert generate
npm run build-all
npm run setup-debug
npm run start

• npx winapp restore downloads the WinAppSDK NuGet packages and regenerates the JS bindings in .winapp/bindings/.
• npx winapp cert generate creates a self-signed certificate for local development.
• npm run build-all compiles the native addon for both x64 and arm64.
• npm run setup-debug registers the WinAppSDK framework package dependency.

You should see a .winapp directory at the root of your repo.

This project uses @microsoft/dynwinrt to dynamically call Windows Runtime AI APIs from JavaScript. The bindings are generated by @microsoft/winappcli into .winapp/bindings/ and exposed through #winapp/bindings for both ESM imports and CommonJS requires.

ES modules:

import { LanguageModel } from '#winapp/bindings';

CommonJS:

const { StorageFile } = require('#winapp/bindings/StorageFile');

The bindings live in .winapp/bindings/. To regenerate after editing winapp.jsBindings in package.json or bumping a package in winapp.yaml:

npx winapp restore

This refreshes the SDK packages, updates .winapp/winmds.lock.json, runs dynwinrt-codegen, and writes the bindings into .winapp/bindings/.

To add additional Windows SDK classes (Win32 / Windows.* namespaces), edit winapp.jsBindings.additionalWinmds in package.json and re-run npx winapp restore.

This project may contain trademarks or logos for projects, products, or services. Authorized use of Microsoft trademarks or logos is subject to and must follow Microsoft's Trademark & Brand Guidelines. Use of Microsoft trademarks or logos in modified versions of this project must not cause confusion or imply Microsoft sponsorship. Any use of third-party trademarks or logos are subject to those third-party's policies.