Desktop Application (Electron)

MCPJam Inspector can be built and packaged as a standalone desktop application for macOS, Windows, and Linux using Electron and Electron Forge.

Installation

Pre-built installers and packages for all major operating systems are available on the project's GitHub Releases page.

Building from Source

If you wish to build the desktop application yourself, you can use the following npm scripts from the project root:

  1. Start in Development Mode

    This command starts the Electron app with hot-reloading for the main process, preload script, and renderer process (the React UI).

    npm run electron:start
  2. Package the Application

    This script bundles your application into a platform-specific, uncompressed folder (e.g., a .app folder on macOS).

    npm run electron:package
  3. Create a Distributable Installer

    This is the main command for creating a final, shareable installer (.dmg, .exe, .deb, etc.). It first generates necessary icons and then runs the Electron Forge make process.

    npm run electron:make

    The output will be located in the out/make directory.

Build Configuration

The desktop application build process is configured in forge.config.ts.

Key Configuration Points:

  • packagerConfig: Defines how the application is packaged before being made into an installer. This includes settings like the app's bundle ID, name, and icon.

    packagerConfig: {
      asar: true,
      appBundleId: "com.mcpjam.inspector",
      appCategoryType: "public.app-category.developer-tools",
      executableName: "mcpjam-inspector",
      icon: "assets/icon",
      // ...
    },
  • makers: Specifies the types of installers to create for different operating systems.

    makers: [
      new MakerSquirrel({ ... }), // Windows
      new MakerZIP({}, ["darwin", "linux"]),
      new MakerDMG({ ... }),     // macOS
      new MakerDeb({ ... }),     // Debian/Ubuntu
      new MakerRpm({ ... }),     // Fedora/CentOS
    ],
  • plugins: Integrates Electron Forge with other tools, like Vite for bundling the source code.

Code Signing & Notarization

The configuration in forge.config.ts includes placeholders and logic for code signing on both macOS and Windows, as well as notarization for macOS. These steps are crucial for distributing a trusted application.

  • macOS: Uses environment variables like MAC_CODESIGN_IDENTITY, APPLE_API_KEY_ID, APPLE_API_ISSUER_ID, and APPLE_API_KEY_FILE to sign and notarize the app.
  • Windows: Uses WINDOWS_PFX_FILE and WINDOWS_PFX_PASSWORD for code signing.

These variables are typically set in a secure CI/CD environment, as demonstrated in the GitHub Actions workflows (.github/workflows/mac-release.yml and .github/workflows/windows-release.yml).