Electron React 应用程序白屏 + 构建中断开连接的 devtools 但开发中很好？

Question

当我在开发服务器 (npm start) 上运行我的应用程序时，它运行良好，在控制台中没有任何问题。

但是，当我构建我的应用程序 (npm run build && electron-builder -m) 时，我得到一个白屏并断开了 devTools。

这是我的 main.js 文件

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

let mainWindow;

function createWindow () {
  // Create the browser window.
  const { width, height } = screen.getPrimaryDisplay().workAreaSize
  const win = new BrowserWindow({
    title:"DSL viewer",
    width:1050,
    height:700,
    maxHeight:height,
    maxWidth:width,
    minHeight:700,
    minWidth:1050,
    webPreferences: {
      nodeIntegration: true,
      enableRemoteModule: true,
      devTools: true
    }
  })

  win.loadURL('./index.html');
  
  win.on('closed', function () {
    mainWindow = null;
  });
}

// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(createWindow)

// Quit when all windows are closed, except on macOS. There, it's common
// for applications and their menu bar to stay active until the user quits
// explicitly with Cmd + Q.
app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  // On macOS it's common to re-create a window in the app when the
  // dock icon is clicked and there are no other windows open.
  
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and require them here.

这是应用的截图

有谁知道这可能是什么原因造成的，或者我该如何调试它？

提前致谢！

Answer 1

这是因为 electron 构建后无法找到 index.html。将 window.loadURL 更改为 window.loadURL(__dirname+"/index.html")。