38

我做了一个简单的电子应用程序：

main.js

const {app, BrowserWindow} = require('electron')
const path = require('path')
const url = require('url')

let win

function createWindow () {
  win = new BrowserWindow({
    width: 800, 
    height: 600, 
    icon: path.join(__dirname, 'icon.ico')
  })

  win.maximize();

  win.loadURL('https://stackoverflow.com/', {"extraHeaders" : "pragma: no-cache\n"});

  win.on('closed', () => {
    win = null
  })
}

app.on('ready', createWindow)

app.on('browser-window-created',function(e,window) {
    window.setMenu(null);
});

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  if (win === null) {
    createWindow()
  }
})

包.json

{
  "name": "test",
  "version": "1.0.0",
  "main": "main.js",
  "build": {
    "appId": "com.test.app",
    "copyright": "test",
    "productName": "test"
  },
  "devDependencies": {
    "electron": "1.7.9",
    "electron-builder": "^19.46.4",
    "electron-packager": "^10.1.0"
  }
}

使用电子打包器，我已经构建了要发布的包：

electron-packager . --overwrite --asar=true --platform=win32 --arch=ia32 --prune=true --out=release-builds

构建包的总大小为107 MB。

有人有减小包装尺寸的技巧吗？

4

4 回答 4

25

You can reduce the electron app size by packaging using electron-builder package.

PicArt is an electronjs app which I developed recently. It is built using reactJS. Initially when I packaged the app using electron-packager the Window's build size was around 98 MB. Then I found this awesome boilerplate electron-react where they configured the electron-builder to produced optimised build size. After using those configuration setup, PicArt's build is now around 36 MB.

Yes, it is possible to reduce the app size , but it quite painful and time consuming to configure the build setup.

于 2018-09-15T13:34:56.747 回答
18

通过将“电子”和我的 reactJs 移动到... ，我设法将我的 mac 应用程序的最终大小从250MB减少到128MB ... 因为我所需要的只是在最终的 bundle.js 中dependenciesdevDependenciespackage.json

但遗憾的是，我无法得到比这更低的值，因为 electron 框架是118MB，如果你正在制作一个小应用程序，这将是一些东西，但我想这就是制作跨平台 Web 应用程序所要付出的代价

于 2018-09-18T20:00:42.500 回答
4

我在使用 200MB 的应用程序时遇到了同样的问题。设法将其降至 176MB，最后降至 55MB。

这是我所做的（如果有帮助的话）：

  • Electron-builder : 打包应用
  • 修剪：清理未使用的模块
  • 清理 package.json 文件：依赖项

打包应用程序：

注意：我制作了一个 Windows 应用程序。

文档中提到了一个两步 package.json 方法，但是在尝试自己（并确认文档）之后就不需要了。

对我来说奇怪的是，删除了我的整个“节点模块”文件夹，并运行“npm install”以恢复所有内容。在那之后，我立即运行“npm prune”来清除“节点模块”文件夹中未使用的任何内容（即使我只是运行了“npm install”）。我还仔细检查了 package.json 文件的“依赖项”部分中没有电子和电子生成器。在此之后，我打包了 app/

每个人都可能已经知道，使用 electron-builder，您的“dist”文件夹（除非您更改了默认目录）应该包含一个.exe直接位于“dist”目录中的文件和一个“未打包”文件夹，其中包含一个.exe取决于相关文件的文件同一文件夹中的文件。但是，.exe我拥有的文件（直接位于“dist”文件夹中的文件）只有 55MB。虽然公平地说，这个文件确实安装了程序，并且一旦安装，大小确实会膨胀到 171MB 左右。

如果我能找到另一种减小文件大小的方法，我会再次发布。

于 2021-03-03T23:14:42.037 回答
1

Electron 版本对于减小封装尺寸很重要。

没有 CEF 重新编译的 Windows x64 上的最小包大小：

  • Electron v16.0.2Chromium v96=> 52.9MB

  • Electron v3.1.13Chromium v66=> 32.4MB

您可以从这里选择您最好的电子版本

选择版本后如何再次缩小尺寸：

  1. 为您的客户删除未使用的文件，例如d3dcompiler_47.dll
  2. 使用更好的压缩算法，例如7zip

Windows 上 Electron v3 打包的所有必要文件，例如：

└─App
    │  App.exe
    │  content_shell.pak
    │  ffmpeg.dll
    │  icudtl.dat
    │  natives_blob.bin
    │  node.dll
    │  v8_context_snapshot.bin
    │
    ├─locales
    │      en-US.pak
    │
    └─resources
           App.asar
           electron.asar
于 2021-12-11T02:30:02.043 回答