电子显示空白窗口

分享于2022年07月17日 electron html javascript node.js 问答
【问题标题】:电子显示空白窗口(Electron shows blank window)
【发布时间】:2022-04-29 15:24:50
【问题描述】:

我的 HTML 文件没有加载,教程中说它会加载。这就是我所拥有的。是的,我已经尝试过各种涉及路径的时髦的东西,但它并没有解决问题。

main.js

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

const createWindow = () => {
    const win = new BrowserWindow({
      width: 800,
      height: 600
    })
  
    win.loadFile("index.html")
  }

  app.whenReady().then(() => {
    createWindow()
  })

index.html



  
    
    
    
    
    Hello World!
  
  
    

Hello World!

We are using Node.js , Chromium , and Electron .

Electron shows blank window


【解决方案1】:

您可能需要更改 JavaScript 代码以获得 HTML 文件的完整路径。


试试下面的代码,它会配置 Electron。在事件监听中,它正在创建一个没有配置的新 BrowserWindow (尽管您可以根据需要添加它)。然后,它正在加载 HTML 文件的完整路径。

const electron = require("electron");

const {
  app,
  BrowserWindow
} = electron;

app.on("ready", () => {
  const mainWindow = new BrowserWindow({});
  mainWindow.loadURL(`file://${__dirname}\\index.html`);
});

  • 这行得通,但为什么呢?
  • 这很可能是 Electron 的工作方式。它喜欢拥有完整路径,而不是相对路径。