如何减小Electron Angle应用程序的大小

Question

我正在尝试为 Windows 和 Linux 平台设计一个 Angular 应用程序。我正在使用电子框架。我刚刚构建了一个显示角度主页的简单应用程序。该应用程序的大小约为 250MB。这太大了。如果有人开发了电子角度应用程序。您能提及您的应用程序的大小吗？以及有关如何减小应用程序大小的任何提示。 注意：Angular 应用程序编译到 /dist，其大小仅为 250KB，但构建整个应用程序时为 250MB！

** main.js**

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

let win;

console.log(__dirname);
function createWindow () {
  // Create the browser window.
  win = new BrowserWindow({
    width: 600, 
    height: 600,
    backgroundColor: '#ffffff',
    icon: `file://${__dirname}/dist/Angular-electron/favicon.ico`
  })


  win.loadURL(`file://${__dirname}/dist//Angular-electron/index.html`)

  //// uncomment below to open the DevTools.
  // win.webContents.openDevTools()

  // Event when the window is closed.
  win.on('closed', function () {
    win = null
  })
}

// Create window on electron intialization
app.on('ready', createWindow)

// Quit when all windows are closed.
app.on('window-all-closed', function () {

  // On macOS specific close process
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', function () {
  // macOS specific close process
  if (win === null) {
    createWindow()
  }
})

下面是根组件。

app.component.html

<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
</div>

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Angular-electron';
 
}

这是package.json脚本，我构建了Angular并同时构建了Electron，如下所示 注意：我使用电子打包器来构建用于生产的应用程序。

"builderForWindows": "ng build --prod && electron-packager ./dist --out winx64 --overwrite --platform win32 "

以下是应用程序的屏幕截图。

Answer 1

当您为 Electron 构建应用程序时，它会在

dependencies

 的 

package.json

部分添加所有依赖项

尝试移动

devDependencies

 的 

package.json

部分中的所有角度依赖关系

这应该会减少最终包裹的大小。

否则你应该看看 electron-builder 并开始将你的应用程序构建为 Linux/MacOS/Windows 包。

例如，我的电子角项目生成一个 45Mo Windows 可执行文件。

Answer 2

在这个视频中我解释了如何减小电子应用程序的大小，你可以查看。 https://www.youtube.com/watch?v=88pBma3xKs4