00
:
00
:
00
:
00
Corso SEO AI - Usa SEOEMAIL al checkout per il 30% di sconto

Electron Builder

electron-builder è una soluzione completa per il packaging e la distribuzione di applicazioni Electron. Supporta la creazione di installer per Windows, macOS e Linux con molte opzioni di personalizzazione.

Installazione

npm install electron-builder --save-dev

Configurazione nel package.json

{
  "name": "mia-app",
  "version": "1.0.0",
  "main": "src/main/main.js",
  "scripts": {
    "start": "electron .",
    "build": "electron-builder",
    "build:win": "electron-builder --win",
    "build:mac": "electron-builder --mac",
    "build:linux": "electron-builder --linux",
    "build:all": "electron-builder -mwl"
  },
  "build": {
    "appId": "com.example.miaapp",
    "productName": "La Mia App",
    "directories": {
      "output": "dist"
    },
    "files": [
      "src/**/*",
      "assets/**/*",
      "package.json"
    ],
    "win": {
      "target": ["nsis", "portable"],
      "icon": "assets/icon.ico"
    },
    "mac": {
      "target": ["dmg", "zip"],
      "icon": "assets/icon.icns",
      "category": "public.app-category.developer-tools"
    },
    "linux": {
      "target": ["AppImage", "deb"],
      "icon": "assets/icon.png",
      "category": "Development"
    }
  }
}

File di Configurazione Separato

Per configurazioni più complesse, usa un file dedicato:

# electron-builder.yml
appId: com.example.miaapp
productName: La Mia App
copyright: Copyright © 2026 Tuo Nome

directories:
  output: dist
  buildResources: assets

files:
  - src/**/*
  - assets/**/*
  - package.json
  - "!**/*.map"
  - "!**/node_modules/**/*.md"

asar: true

win:
  target:
    - target: nsis
      arch: [x64, ia32]
  icon: assets/icon.ico

nsis:
  oneClick: false
  allowToChangeInstallationDirectory: true
  installerIcon: assets/icon.ico
  uninstallerIcon: assets/icon.ico
  license: LICENSE.md

mac:
  target:
    - target: dmg
    - target: zip
  icon: assets/icon.icns
  category: public.app-category.developer-tools
  hardenedRuntime: true

dmg:
  contents:
    - x: 130
      y: 220
    - x: 410
      y: 220
      type: link
      path: /Applications

linux:
  target:
    - target: AppImage
    - target: deb
  icon: assets/icon.png
  category: Development
  synopsis: Descrizione breve dell'app
  description: Descrizione completa dell'app

deb:
  depends:
    - libnotify4
    - libxtst6

Target di Build

Windows

Target Descrizione
nsis Installer NSIS (consigliato)
nsis-web Installer web (scarica durante installazione)
portable Eseguibile portatile (no installazione)
msi Windows Installer (MSI)
appx Microsoft Store

macOS

Target Descrizione
dmg Immagine disco (consigliato)
zip Archivio ZIP (per auto-update)
pkg Installer PKG
mas Mac App Store

Linux

Target Descrizione
AppImage AppImage universale (consigliato)
deb Pacchetto Debian/Ubuntu
rpm Pacchetto Red Hat/Fedora
snap Pacchetto Snap
flatpak Pacchetto Flatpak

Comandi di Build

# Build per la piattaforma corrente
npx electron-builder

# Build per Windows
npx electron-builder --win

# Build per macOS
npx electron-builder --mac

# Build per Linux
npx electron-builder --linux

# Build per tutte le piattaforme
npx electron-builder -mwl

# Build senza packaging (per test)
npx electron-builder --dir

# Build e pubblicazione
npx electron-builder --publish always

Configurazione NSIS (Windows)

{
  "build": {
    "nsis": {
      "oneClick": false,
      "allowToChangeInstallationDirectory": true,
      "createDesktopShortcut": true,
      "createStartMenuShortcut": true,
      "shortcutName": "La Mia App",
      "installerIcon": "assets/installer.ico",
      "uninstallerIcon": "assets/uninstaller.ico",
      "installerSidebar": "assets/installer-sidebar.bmp",
      "license": "LICENSE.md",
      "perMachine": false
    }
  }
}

Auto-Update con electron-builder

{
  "build": {
    "publish": [
      {
        "provider": "github",
        "owner": "tuo-username",
        "repo": "tuo-repo",
        "releaseType": "release"
      }
    ]
  }
}
# Pubblica su GitHub Releases
export GH_TOKEN=ghp_tuoToken
npx electron-builder --publish always

ASAR Packaging

ASAR è un formato di archivio che protegge il codice sorgente:

{
  "build": {
    "asar": true,
    "asarUnpack": [
      "**/*.node",
      "**/native-addon/**"
    ]
  }
}

asarUnpack specifica i file che devono restare fuori dall’archivio (necessario per moduli nativi).

File Extra e Risorse

{
  "build": {
    "extraResources": [
      {
        "from": "resources/database.sqlite",
        "to": "database.sqlite"
      }
    ],
    "extraFiles": [
      {
        "from": "config/default.json",
        "to": "config.json"
      }
    ]
  }
}
  • extraResources: File accessibili tramite process.resourcesPath
  • extraFiles: File posizionati nella root dell’app

Build Multi-Architettura

{
  "build": {
    "win": {
      "target": [
        {
          "target": "nsis",
          "arch": ["x64", "ia32", "arm64"]
        }
      ]
    },
    "mac": {
      "target": [
        {
          "target": "dmg",
          "arch": ["x64", "arm64", "universal"]
        }
      ]
    }
  }
}

Best Practice

  1. Usa ASAR per proteggere il codice sorgente e migliorare le performance di lettura
  2. Testa su tutte le piattaforme prima del rilascio
  3. Firma il codice per Windows e macOS (necessario per la distribuzione)
  4. Escludi file non necessari dalla build con il campo files
  5. Usa --dir durante lo sviluppo per build più veloce (senza installer)