使用电子生成器构建后，电子应用程序未加载 index.html，甚至没有给出错误

Posted 2023-03-07

【中文标题】使用电子生成器构建后，电子应用程序未加载 index.html，甚至没有给出错误

【英文标题】：Electron app not loading index.html after building with electron builder, even giving no error

【发布时间】：2020-12-31 19:52:09

【问题描述】：

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

【参考方案1】：

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

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

我刚刚在 main.js（浏览器窗口参数）中将其路径更改为 uninstallerIcon.ico（如果不工作，请尝试 uninstallIcon.ico），这将由我的 package.json 自动创建并嵌入到安装程序中并包含在同一个安装后文件夹作为应用程序。它使应用程序在安装设置后工作。

【参考方案2】：

我在 Windows 10 上使用电子应用程序时遇到了类似的问题，如https://github.com/ColumbusCollaboratory/electron-quick-start 所示。上述解决方案没有帮助。我必须去便携式 R 库并安装所需的包才能让空白屏幕消失。阅读下面我的评论了解更多详情

【讨论】：

“空白页不再显示”是什么意思？你的问题解决了吗？

@hemantkumar 是的，我的问题解决了，但问题的根源是安装了不同版本的 R 包，顺序不正确！所以基本上，我进入 /R-Portable-Win/bin/ 目录并运行 R.exe 并使用它安装我的 app.R 运行所需的包。结果，空白屏幕消失了。这些是我为使 electron-quick-start guide 工作而安装的软件包：“稍后”“rlang”“承诺”