当我试图为windows构建时，我也遇到了类似的问题。
虽然win.loadURL(...)在开发中看起来是这样工作的，但在构建时可以尝试将其更改为：

win.loadURL(url.format({
  pathname: path.join(__dirname, 'index.html'),
  protocol: 'file:',
  slashes: true
}));

这可以确保它明确获得index.html文件的正确路径。
要使path.join(...)和url.format(...)正常工作，您需要先执行require：

const path = require('path');
const url = require('url');

我最近面临白色问题，在我的情况下一点点差异
我用vue框架与路由器（路由器必须是哈希）
1.对于电子版中带有vue路由器的vue.js

const router = new VueRouter({
  mode: 'hash',
  routes: [...]
})

2.用于电子中带有react路由器的react.js

hashrouter

型
代替

BrowserRouter

没有任何框架
检查入口点url正确放置

win.loadURL('app://./index.html')

在我的例子中，构建也显示了一个白色站点。对于那些在项目中使用React Router的人来说，这个解决方案可能会有帮助。
我的startUrl变量如下所示：

const startUrl = process.env.ELECTRON_START_URL || url.format(
 {
    pathname: path.join(__dirname, '/../build/index.html'),
    protocol: 'file:',
    slashes: true
 });

对我来说，解决方案是在App.js中从BrowserRouter迁移到HashRouter，如本文中所述

render() 
{
  return (
     <Provider store = { store }>
        <HashRouter>
           <Switch>
              <Route exact path='/' component={Home} />
              <Route exact path='/Login' component={Login} />
           </Switch>
        </HashRouter>
     </Provider>
  );
}

我不知道构建过程，特别是，我也有同样的问题，开发，电子显示什么，但一个空白的屏幕（可能是因为我点击了一个链接，这是不可用的早期）。
重建后，什么都没有显示在屏幕上。
对我有效的最后一个黑客是从系统中清除我的Appdata.
在我的例子中，我使用的是Linux，我通过转到~/.config/myApp来清除应用程序数据
窗口：C:\Users\<user>\AppData\Roaming\<yourAppName>\Cache
操作系统X：x1个主机2个主机
希望它能帮助有需要的人。

也许你使用了一个代码模板，它使用了两种情况，一种用于开发模式，一种用于生产模式，至少这是我的问题，所以对于开发模式，我使用了一个指向localhost的URL，而在生产模式下，它指向构建目录：像这样：

const prodPath = format({
  pathname: resolve('renderer/out/start/index.html'),
  protocol: 'file:',
  slashes: true
})

检查你如何设置主窗口的标题.
我尝试使用“进程.环境.npm_包_产品名称”

mainWindow.setTitle(process.env.npm_package_productName);

在当地工作正常，但 Package 时失败！

我认为您的索引对于vue-router是错误的。要检查它，您可以在App. vue中放入一些文本。如果文本出现，您必须重定向到/

// App.vue

<template>
    <div>
        <h1>Test</h1>
        <router-view />
    </div>
</template>

<script setup lang="ts">
import { onMounted } from 'vue';
import router from './router'

onMounted(() => {
    router.push('/')
})
</script>

我也遇到了同样的问题。我认为这是一个错误的理解，电子应用程序将被捆绑成一个单一的.exe文件。
我使用了GitHub的electron-react-boilerplate模板，如果你要打包你的应用程序，它所做的就是生成一个目录，里面包含你的捆绑代码（electron-react-boilerplate模板会帮你做这些），以及一堆其他文件，其中包含release/build/win中生成的.exe文件-unpacked在release/build文件夹中。
要让它发挥作用，您需要做的是：
在release/app/dist/renderer/index.html（CODEWISE）中获取index.html文件的绝对路径（在主.ts/js中获取此路径）
然后在mainWindow.loadUrl()函数中使用这个文件url。
然后你会意识到，整个发布文件夹实际上是你的应用程序分发给你的客户端。

注：对于启动电子应用程序，请按照以下步骤操作：（原谅我的英语我的母语是法语）
1.首先忘记电子文件夹，不要碰它。
1.在react/ion目录（应用的根目录）中，将以下内容添加到package.json文件中："homepage": "./"
1.现在，从react/ionic目录（应用程序的根目录）导航到“public”目录，并更新index.html文件，将<base href="/" />替换为：<base href="./" />

• 现在运行以下命令，就这样...
• ionic build && npx cap copy
• npx cap open electron