Javascript 在electron中加载本地html文件的简单方法

我一直在尝试将一个小型Web应用程序转换为一个电子应用程序。它工作得很好，只是我需要将一堆文件（.html）加载到主DOM中。在webapp中，我刚刚使用了

$。get

，但如何在electron中实现呢？我试着查看文档，但除了IPC管道之外，我找不到一个简单的方法来实现这一点（我不太明白）

谁能给我指一下正确的方向吗

编辑

我会在这里澄清。我有一个启动浏览器窗口的主进程

mainWindow = new BrowserWindow({width: 800, height: 600})

然后，在通过

标记导入的

js

文件中，我想在对话框中加载并附加一些文件：

$('.dialog').load('pages/hello.html', {})

---

亲切问候

在Electron中，您可以使用

fs.readFile

因此：

如果我没有打字错误，它应该能用。

---

它将文件读取为字符串，因此您需要使用DOMParser解析此字符串。

在Electron端，您将看到此代码以

Electron

库开头。通过ES6解构，您可以关闭

app

属性。

app

对象表示计算机上的整个运行进程

const electron = require('electron');
const { app } = electron;

然后要添加事件处理程序：

app.on('ready', () => {
      console.log('app is ready');
});

一旦你成功地运行了这个。您已经提取了

app

属性，该属性是底层进程。您已使用

app

对象成功添加了基于事件的函数

因此，如果您想创建一个新的浏览器窗口来向用户显示内容，您可以提取另一个名为

BrowserWindow

的属性，将一个空对象与您的配置一起传递给它

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

app.on('ready', () => {
  const mainWindow = new BrowserWindow({width: 800, height: 600});
});

然后，您可以通过调用传递ES6模板字符串的方法

loadURL（）

来加载HTML文档：

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

app.on('ready', () => {
  const mainWindow = new BrowserWindow({width: 800, height: 600});
  mainWindow.loadURL(`file://${__dirname}/index.html`);
});

---

您能否提供您在web应用程序中所做的以及您在Electron中尝试所做的任何示例（实际上是代码）？编辑@naeramarth7。我不知道这是否是正确的方法，也许我应该在主文件中迁移js代码。谢谢：）问题是我正在尝试从从html导入的js文件中迁移js代码，这可能不是最好的方法。这在dev中有效，但在prod构建中不适用。

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

app.on('ready', () => {
  const mainWindow = new BrowserWindow({width: 800, height: 600});
  mainWindow.loadURL(`file://${__dirname}/index.html`);
});