Paketera din elektronapp för distribution

Den här guiden visar hur du skapar ett MSIX-paket för att distribuera din Electron-app med Windows-API:er.

Förutsättningar

Kontrollera att du innan förpackning har:

• Installationen av utvecklingsmiljön har slutförts
• [VALFRITT] Skapade och testade tillägget (t.ex. Phi Silica-tillägg eller WinML-tillägg)
• Verifierat att din app körs korrekt med npm start

Förbereda för paketering

Konfigurera Electron Forge för att undanta temporära filer från den slutliga versionen. Lägg till en ignore matris i packagerConfig i forge.config.js:

module.exports = {
  packagerConfig: {
    asar: true,
    ignore: [
      /^\/\.winapp($|\/)/,     // SDK packages and headers
      /^\/winapp\.yaml$/,       // SDK config
      /\.pfx$/,                 // Certificate files
      /\.pdb$/,                 // Debug symbols
      /\/obj($|\/)/,            // C# build artifacts
      /\/bin($|\/)/,            // C# build artifacts
      /\.msix$/                 // MSIX packages
    ]
  },
  // ... rest of your config
};

Generera ett utvecklingscertifikat

Generera ett utvecklingscertifikat innan du skapar ett signerat MSIX-paket:

npx winapp cert generate

Då skapas en devcert.pfx fil i projektroten som ska användas för att signera MSIX-paketet.

Paketeringsalternativ

Du har två alternativ för att skapa ett MSIX-paket för din Electron-app:

1. Alternativ 1: Använda winapp CLI direkt – Mer konfigurerbar, fungerar med alla paketerare
2. Alternativ 2: Använda Electron Forge MSIX Maker – Mer integrerat i forge-arbetsflödet

Välj det alternativ som passar ditt arbetsflöde bäst.

Alternativ 1: Använda winapp CLI direkt (rekommenderas för flexibilitet)

Den här metoden ger dig mer kontroll över förpackningsprocessen och fungerar med alla Elektron-paketerare.

Skapa din elektronapp

För att paketera din Electron-app med MSIX måste vi först skapa produktionslayouten. Med Electron Forge kan vi använda paketkommandot:

# Package with Electron Forge (or your preferred packager)
npx electron-forge package

Då skapas en produktionsversion av appen i ./out/ mappen . Det exakta mappnamnet beror på appens namn och arkitektur (t.ex. my-windows-app-win32-x64).

Skapa MSIX-paketet

Använd nu winapp CLI för att skapa och signera ett MSIX-paket från din paketerade app:

npx winapp pack .\out\<your-app-folder> --output .\out --cert .\devcert.pfx --manifest .\Package.appxmanifest

Ersätt <your-app-folder> med det faktiska mappnamnet som skapats av Electron Forge (t.ex. my-windows-app-win32-x64 för x64 eller my-windows-app-win32-arm64 FÖR ARM64).

Alternativet --manifest är valfritt. Om den inte tillhandahålls letar den efter en Package.appxmanifest i mappen som paketeras eller i den aktuella katalogen.

Alternativet --cert är också valfritt. Om det inte anges kommer msixet inte att signeras.

Alternativet --output är också valfritt. Om den inte anges används den aktuella katalogen.

MSIX-paketet skapas som ./out/<your-app-name>.msix.

{
  "scripts": {
    "package-msix": "npm run build-csAddon && npx electron-forge package && npx winapp pack ./out/my-windows-app-win32-x64 --output ./out --cert ./devcert.pfx --manifest Package.appxmanifest"
  }
}

Alternativ 2: Använda Electron Forge MSIX Maker (för smidningsanvändare)

Om du redan använder Electron Forge kan du integrera MSIX-paketering direkt i Forge-arbetsflödet med hjälp av @electron-forge/maker-msix generatorn.

Installera MSIX Maker

npm install --save-dev @electron-forge/maker-msix

Konfigurera forge.config.js

Lägg till MSIX-tillverkaren i forge.config.js:

module.exports = {
  // ... other config
  makers: [
    {
      name: '@electron-forge/maker-msix',
      config: {
        appManifest: '.\\Package.appxmanifest',
        windowsSignOptions: {
          certificateFile: '.\\devcert.pfx',
          certificatePassword: 'password'
        }
      }
    }
  ],
  // ... rest of your config
};

Uppdatering av Package.appxmanifest

Electron Forge MSIX Maker använder en annan mapplayout än metoden winapp CLI. Den placerar din app i en app\ mapp i MSIX. Den här mappen skapas automatiskt under paketeringen – du behöver inte skapa den själv. Executable Uppdatera sökvägen i din Package.appxmanifest så att den pekar på app mappen:

<Applications>
  <Application Id="myApp"
    Executable="app\my-app.exe"
    EntryPoint="Windows.FullTrustApplication">
    <!-- ... rest of your application config -->
  </Application>
</Applications>

Ersätt my-app.exe med ditt faktiska körbara namn. Detta baseras på fältet productName (eller name) i package.json.

Skapa MSIX-paketet

Nu kan du skapa MSIX-paketet. --targets Använd flaggan för att endast köra MSIX-tillverkaren (annars kör Forge alla konfigurerade tillverkare):

npx electron-forge make --targets @electron-forge/maker-msix

MSIX-paketet skapas i ./out/make/msix/<arch>/ mappen (t.ex. ./out/make/msix/arm64/ eller ./out/make/msix/x64/).

Installera och testa MSIX

Installera först utvecklingscertifikatet (engångskonfiguration):

# Run as Administrator:
npx winapp cert install .\devcert.pfx

Installera nu MSIX-paketet. Dubbelklicka på msix-filen eller kör följande kommando:

# Option 1 output:
Add-AppxPackage .\out\<your-app-name>.msix

# Option 2 output:
Add-AppxPackage .\out\make\msix\<arch>\<your-app-name>.msix

Ersätt <your-app-name> och <arch> med de faktiska värdena från byggutdata.

Din app visas på Start-menyn! Starta den och testa dina Windows API-funktioner.

Distributionsalternativ

När du har ett fungerande MSIX-paket har du flera alternativ för att distribuera din app:

Direkt nedladdning

Tillhandahåll MSIX-paketet på din webbplats för direkt nedladdning. Se till att du signerar det med ett kodsigneringscertifikat från en betrodd certifikatutfärdare (CA) så att användarna kan installera det utan säkerhetsvarningar.

Microsoft Store

Skicka din app till Microsoft Store för den bredaste distributionen och automatiska uppdateringar. Du behöver:

1. Skapa ett Microsoft Partner Center konto
2. Reservera ditt appnamn
3. Uppdatera Package.appxmanifest med din Store-identitet. Du behöver inte signera msixet. Publiceringsprocessen för butiken signerar den automatiskt.
4. Skicka in för certifiering

Läs mer: Publicera din app till Microsoft Store

Företagsdistribution

Distribuera direkt till företagskunder via:

• Company Portal – För organisationer som använder Intune
• Direktnedladdning – Hosta MSIX på din webbplats
• Sidladdning – Installera via PowerShell eller App Installer

Läs mer: Distribuera appar utanför Store

Installationsprogram för appar

Skapa en .appinstaller fil för automatiska uppdateringar:

<?xml version="1.0" encoding="utf-8"?>
<AppInstaller
    Uri="https://your-domain.com/packages/myapp.appinstaller"
    Version="1.0.0.0"
    xmlns="http://schemas.microsoft.com/appx/appinstaller/2017/2">
    <MainPackage
        Name="YourAppName"
        Version="1.0.0.0"
        Publisher="CN=YourPublisher"
        Uri="https://your-domain.com/packages/myapp.msix"
        ProcessorArchitecture="x64" />
    <UpdateSettings>
        <OnLaunch HoursBetweenUpdateChecks="24" />
    </UpdateSettings>
</AppInstaller>

Läs mer: Översikt över appinstallationsfil

Nästa steg

Grattis! Du har paketerat din Windows-aktiverade Electron-app för distribution! 🎉

Ytterligare resurser

• winapp CLI-dokumentation – Fullständig CLI-referens
• Exempel på Electron-app – Komplett arbetsexempel
• Dokumentation om MSIX-paketering – Läs mer om MSIX
• Windows App Certification Kit – Testa appen innan store skickas in

Återgå till översikt

• Översikt över komma igång – Gå tillbaka till huvudguiden
• Konfigurera utvecklingsmiljö – Granska konfigurationsstegen
• Skapa ett Phi Silica-tillägg – Granska skapandet av tillägg
• Skapa ett WinML-tillägg – Lär dig mer om WinML-integrering

Få hjälp

• Har du hittat en bugg?Skapa ett problem

Lycka till med distributionen! 🚀