如何在电子上加载 index.html 文件？

Question

I'm creating an app with electron and Angular.

Currently to load my index.html file my code looks like this.

exports.window = function window() {

  this.createWindow = (theBrowserWindow) => {
    // Create the browser window.
    let win = new theBrowserWindow({
      width: 900,
      height: 600,
      webPreferences: {
        nodeIntegration: true
      },
      resizable:false
    });

    // and load the index.html of the app.
    win.loadFile(`file://${__dirname}/dist/index.html`)

    // Chrome Dev Tools
    win.webContents.openDevTools()  
  };
}

in particular

 win.loadFile(`file://${__dirname}/dist/index.html`)

However when i run the code I keep getting the error message.

Not allowed to load local resource:

I'm unsure how to load the index.html file for the electron app. What the right syntax is.

I've tried "index.html" and "./index.html" but can't seem to find the solution.

Any help on what to put would be appreciated

Answer 1

I'm not sure of your project structure, but in my Electron app when loading the window, I have the following when loading the html page:

mainWindow.loadFile(path.join(__dirname, 'index.html'));

In my case currently, index.html is in the same directory as the js file that is executing the window creation.