Question

我正在尝试首次使用Electron设置我的应用程序。完成添加main.js，更改index.html，更改package.json的初始步骤。当我尝试使用命令npm run electron-build运行应用程序时，出现如下屏幕。

我无法运行我的应用程序。基本上这不是一个错误，而只是缺乏信息。任何对此的帮助将不胜感激。 TIA。

main.js

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

let win;

function createWindow () {
  // Create the browser window.
  win = new BrowserWindow({
    width: 600, 
    height: 600,
    backgroundColor: '#ffffff',
    icon: `file://${__dirname}/dist/assets/logo.png`
  })


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

  win.webContents.openDevTools()

  // Event when the window is closed.
  win.on('closed', function () {
    win = null
  })
}

// Create window on electron intialization
app.on('ready', createWindow)

// Quit when all windows are closed.
app.on('window-all-closed', function () {

  // On macOS specific close process
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', function () {
  // macOS specific close process
  if (win === null) {
    createWindow()
  }
})

package.json

 "name": "angular-electron-first-app",
  "version": "0.0.0",
  "main": "main.js",
  "scripts": {
    "ng": "ng",
    "start": "electron .",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "electron": "electron .",
    "electron-build": "ng build --prod && npm run electron ."
  },

index.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>AngularElectron</title>
  <base href="./">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>

</body>
</html>

其他详细信息： Angular v7.1.0 RxJS v6.5.2 NPM v6.5.0

Answer 1

将loadFile与本地资源一起使用

win.loadFile（filePath [，options]）
filePath String

options Object (optional)
    query Object (optional) - Passed to url.format().
    search String (optional) - Passed to url.format().
    hash String (optional) - Passed to url.format().
返回承诺-当页面具有   完成加载（请参见did-finish-load），并在页面失败时拒绝   进行加载（请参阅did-fail-load）。

与webContents.loadFile一样，filePath应该是HTML的路径   相对于应用程序根目录的文件。参见网页内容   文档以获取更多信息。

Answer 2

在尝试寻找答案时，我尝试并发现问题出在 main.js 的loadURL中。下面的代码更改为我解决了这个问题。

main.js

来自

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

收件人

win.loadURL(`file:///${__dirname}/dist/angular-electron-first-app/index.html`);

在这里，angular-election-first-app是在dist文件夹中创建的项目文件夹。

不允许在电子中加载本地资源错误-角度v7.0.1

2 个答案: