如何将 Electron 应用程序部署为 Windows 中的可执行文件或可安装文件？

问题描述 投票：0回答：13

我想生成一个唯一的 

.exe
文件来执行应用程序或 
.msi
来安装应用程序。如何做到这一点？

windows deployment desktop-application electron
13个回答
60
投票

您可以使用 electron-packager 打包您的程序，然后使用 InnoSetup 构建单个安装 EXE 文件。

36
投票

由于大多数答案都没有有关打包的分步说明，因此让我发布如何打包电子应用程序。

我们将首先安装电子打包程序。

Electron Packager 是一个命令行工具和 Node.js 库， 将基于 Electron 的应用程序源代码与重命名的 Electron 捆绑在一起 可执行文件和支持文件放入准备分发的文件夹中。

安装电子打包器： 在 Windows cmd 中运行以下命令

npm install -g electron-packager --save-dev

接下来，让我们打包适用于 windowsx64 的应用程序：

electron-packager appdirectory appName --platform=win32 --arch=x64 --electron-version=1.4.3
20
投票

2020更新 您可以使用 electron-builder 为您的电子应用程序创建可移植的 .exe 文件。 您需要做的就是安装 electro-builder 

yarn add electron-builder --dev
然后创建一个像这样的 package.json 文件（这仅适用于便携式 .exe）：

{
  "name": "my-electron-app",
  "productName": "electron app",
  "version": "1.0.0",
  "description": "an electron app",
  "main": "main.js",
  "scripts": {
    "start": "electron .",
    "dist": "electron-builder"
  },
  "devDependencies": {
    "electron": "^8.0.2",
    "electron-builder": "^22.3.2"
  },
  "build": {
    "appId": "com.electron.app",
    "win": {
      "target": "portable"
    },
    "portable": {
      "unicode": false,
      "artifactName": "my_electron_app.exe"
    }
  }
}
10
投票

有很多好的模块可以生成单个安装程序 *exe 文件。查看其中任何一个：

  • 电子构建器（生成适用于 Windows、Mac 和 Linux 的可执行文件，具有无服务器应用程序自动更新功能、代码签名、发布等，更少样板）

  • electron-forge（生成适用于 Windows、Mac 和 Linux 的可执行文件，它不仅打包应用程序，还可以帮助您创建它们，更多样板文件）

  • windows-installer（易于使用，重量轻，仅生成exe文件）

（还在困惑选择哪一个？比较这里）

7
投票

您还可以尝试使用 电子样板。其中有 gulp 的“发布”任务，它将为所有跨平台创建单个准备就绪的可执行文件。您只需要从所有三个平台构建应用程序即可生成特定平台的可执行文件。因此您不需要安装任何第三方工具。

7
投票

将电子应用程序打包为可安装或可执行的。 

electron-builder
应该是最好的选择。而且它很容易配置，我们也可以使用电子自动更新程序。这是
electron-builder.json

的示例 
{
  "publish": {
    // This can be also 's3', 'github'... based on which server you are using for publish
    // https://www.electron.build/configuration/publish
    "provider": "generic",

    // Feed URL but github provider case, other fields will be required. 'repo', 'owner'...
    "url": "https://myappserver.com/updates/"
  },

  "productName": "My App",
  "appId": "com.myapp.app",

  "directories": {
    // The icon and background in 'buildResources' will be used as app Icon and dmg Background
    "buildResources": "buildResources",

    // output is directory where the packaged app will be placed
    "output": "release"
  },

  // The files which will be packed
  "files": ["src/", "node_modules/", "package.json"],

  "mac": {
    "target": ["dmg", "zip"], // Also can be, 'pkg', ...
    "artifactName": "${productName}-${version}-${os}.${ext}"
  },
  "win": {
    "target": ["nsis", "zip"], // Also can be, 'portable', ...
    "artifactName": "${productName}-${version}-${os}.${ext}"
  },
  "linux": {
    "target": ["AppImage"],
    "artifactName": "${productName}-${version}-${os}.${ext}"
  },
  "dmg": {
    "title": "${productName}-${version}",
    "contents": [
      {
        "x": 300,
        "y": 360
      },
      {
        "x": 490,
        "y": 360,
        "type": "link",
        "path": "/Applications"
      }
    ]
  }
}

当然，我们可以添加其他配置如

nsis
、
extraFiles
、
afterPack
、
afterSign
...

以上都是很好用的。您可以在此处查看详细信息和其他字段https://www. Electron.build/configuration/publish

我们可以在

package.json
内部定义这个配置，或者作为一个独立的文件，但名称应该是项目根目录下的
electron-builder.json
或
electron-builder.yml
。

此外，还可以自动更新。 我们应该上传安装程序（dmg、exe、appImage）以及 

zip
、
blockmap
和 
latest-{OS_Name}.yml
文件。

5
投票
npm install -g electron-packager --save-dev
npx electron-packager <appDirectory> appName --platform=win32 --arch=x64
npx electron-packager <appDirectory> appName --overwrite --asar --electron-version=13.4.0 --platform=win32 --arch=x64 --prune=true --out=release-builds --icon=./build/icon.ico"
2
投票

这在 2021/2022 对我有用：

  1. 全局安装 Electron Packager。在命令提示符下运行以下命令

npm install electron-packager -g

  1. 在命令提示符下运行以下命令：

electron-packager D:\sample MySample --platform=win32 --arch=x64

上述命令显示以下输出：

Packaging app for platform win32 x64 using electron v16.0.5

5-10 分钟后，它会创建包含必要文件的文件夹，并在屏幕上显示以下输出：

Wrote new app to D:\sample\MySample-win32-x64

在我的例子中，上述输出目录的大小为 1.09 GB。因此，在运行上面第二点中提到的命令之前，请确保硬盘驱动器中有足够的空间。

  1. 如果您导航到上述目录，您将在其中看到以下 EXE 文件：

MySample.exe

双击 MySample.exe 将启动该文件，其中的应用程序可供您使用。另请注意，它将在本地主机上运行。所以尽情享受吧！

1
投票

嗯...这会起作用，但想法是运行.exe，而不需要将其安装在电脑中...另一种解决方案是使用 Autoplay media Studio 来包装由电子生成的包并制作一个可执行文件或其他解决方案是使用 thinstall vmware...缺点都是商业性的，所以你必须付费...

1
投票

您需要安装电子打包器

您可以按照以下步骤操作。

# for use in npm scripts
npm install electron-packager --save-dev

# for use from cli
npm install electron-packager -g

electron-packager <sourcedir> <appname> --platform=win32 --arch=x64

这是一个示例命令。

electron-packager . app --platform win32 --arch x64 --out dist/
0
投票

有很多解决方案，我建议使用第三个选项，但这些都是我所知道的

  1. 使用

    electron-packager

  2. 使用

    electron-forge

  3. 试试这个：https://stackoverflow.com/a/69807948/15233276

-1
投票

我首先尝试了电子打包程序，但它生成了很多 .dll 文件，但仍然无法运行。

对我有用的是：

npm install
npm run dist --ia32

这生成了一个独立的 exe，不需要其他文件来运行该应用程序。

-2
投票

您也许可以将整个电子应用程序“包装”在 .NET 项目中。然后它创建的单个可执行文件就可以“内部”运行电子应用程序。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.