使用 Electron Builder 构建后，Electron 应用程序未加载 index.html，甚至没有给出错误

Question

我是 electron 的初学者，并用它创建了一个简单的应用程序。它是运行正确使用 cmd。然而，在使用 electron-builder 构建它并打开创建的应用程序之后，它只显示带有电子框架的白色屏幕。我认为这可能是 package.json 中的一个错误，但不确定在哪里？我有 3 个 html 个文件，我的文件夹中有一些图像我想打包。我看过一些示例，但不知道在 "files":[ ] in package.json 中包含什么。但是我已经尝试包含我想要打包的所有文件，但问题仍然存在这是我的 package.json-

{
  "name": "duplichecker",
  "productName": "Multimedia Manager 1.2",
  "version": "1.2.0",
  "description": "delete duplicate and sort images and videos images at a go!",
  "main": "electron-main.js",
  "keywords": [
    "duplichecker",
    "duplicate",
    "images",
    "multimedia manager 1.2.0",
    "multimedia manager 1.2",
    "multimedia manager",
    "sort"
  ],
  "author": "hemant kumar",
  "license": "ISC", 
  "scripts": {
    "start": "electron .",
    "buildi": "electron-builder",
    "postinstall": "electron-builder install-app-deps"
  },
  "devDependencies": {
    "electron": "^9.2.1",
    "electron-builder": "^22.8.0",
    "webpack": "^4.44.1"
  },
  "dependencies": {},
  "build": {

    "directories":{
        "buildResources":"build"
    },
    "files":[
      "build",
      "node_modules",
      "nulshock",
      "package.json",
      "index.html",
      "package-lock.json",
      "electron-main.js"
    ],
  
    "appId": "duplichecker",
      "win": {
      "target": [
        "nsis"
      ],
      "icon": "build/icon.ico"
    },
    
    "nsis": {
      "installerIcon": "build/icon.ico",
      "uninstallerIcon": "build/icon.ico",
      "uninstallDisplayName": "Multimedia Manager",
      "license": "license.txt",
      "oneClick": false,
      "allowToChangeInstallationDirectory": true
    }
  }
}

也许我必须将 main.js 中的 win.loadFile() 更改为什么？

function createWindow () {
  // Create the browser window.
  const win = new BrowserWindow({
    width: 600,
    height: 400,
    icon:'build/icon.ico',
    webPreferences: {
      enableRemoteModule: true,
      nodeIntegration: true,
      webSecurity: false
    }
  });
   
  //maximizes the window;
  win.maximize();

  // and load the index.html of the app.

  win.loadFile("index.html");

Answer 1

我解决了问题。当我将构建文件夹（其中只有 icon.ico）复制到“win-unpacked”- 在 dist 中创建的文件夹 electron-builder 时，解压的应用程序（未打包在安装程序中）工作。不知何故，我不知道为什么，electron-builder 没有打包 build/icon.ico，导致我的 main.js 加载浏览器 window 图标出错。

但是我是如何让安装程序工作的

我刚刚在 main.js（浏览器 window 参数）中将其路径更改为 uninstallerIcon.ico（如果不起作用，请尝试 uninstallIcon.ico），它将由我的 package.json 并嵌入到安装程序中，安装后包含在与应用程序相同的文件夹中。它使应用程序在安装设置后运行。

Answer 2

我在 windows 10 上遇到了与电子应用程序类似的问题，如此处 https://github.com/ColumbusCollaboratory/electron-quick-start 所示。上述解决方案没有帮助。我不得不去便携式 R 库并安装所需的包，以使黑屏消失。阅读下面我的评论了解更多详情

使用 Electron Builder 构建后，Electron 应用程序未加载 index.html，甚至没有给出错误

Electron app not loading index.html after building with electron builder, even giving no error

html

javascript

package.json

electron

electron-builder