Electron.js 快速入门指南：“npm start”错误答案

【问题标题】：Electron.js quick start guide: Errors on "npm start"Electron.js 快速入门指南：“npm start”错误
【发布时间】：2021-06-05 13:24:21
【问题描述】：

我是电子新手，并在此处遵循快速入门指南：https://www.electronjs.org/docs/tutorial/quick-start
我的package.json 有这个：

"scripts": {
    "start": "electron ."
}

当我运行 npm start 时，应用程序启动但版本未打印，并且我在 js 控制台中收到这些错误：

Uncaught ReferenceError: process is not defined at index.html:11
Uncaught ReferenceError: process is not defined at index.html:12
Uncaught ReferenceError: process is not defined at index.html:13

似乎process 没有在 index.html 中定义。但是当我直接运行electron . 时，一切正常。

为什么？

我的版本：

Manjaro 20.2.1，内核 5.10.18-1-MANJARO
Node.js 15.10.0
npm 7.6.1
电子12.0.0

【问题讨论】：

启用节点集成
正如我所写，我是电子初学者，并按照快速入门指南进行操作。你能详细说明一下吗？

标签： node.js npm electron npm-scripts npm-start

【解决方案1】：

您应该使用contextIsolation: false 和nodeIntegration: true

尝试以下方法：

const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false
    }
  })

这里正在讨论这个问题：https://github.com/electron/electron/issues/18139

What is context Isolation?

上下文隔离是一项确保您的预加载脚本和 Electron 的内部逻辑在单独的上下文中运行您在 webContents 中加载的网站。这对安全很重要目的，因为它有助于防止网站访问 Electron 内部或您的预加载脚本可以访问的强大 API。

这意味着您的预加载脚本可以访问的窗口对象 to 实际上是一个不同于网站可以访问的对象到。例如，如果您在预加载中设置了 window.hello = 'wave' 启用脚本和上下文隔离 window.hello 将未定义如果网站试图访问它。

【讨论】：

就是这样！谢谢！我猜电子应该更新它的教程......

【解决方案2】：

确保您已将 nodeIntegration 设置为 true。

main.js

const { BrowserWindow } = require('electron')
let win = new BrowserWindow({
  webPreferences: {
    nodeIntegration: true
  }
})

【讨论】：

正如我所写的，我遵循了快速入门指南，并且 nodeIntegration 设置为 true。如果我称之为“电子”。直接有效。 “npm start”，它调用“电子”。没有。