未捕获的 ReferenceError：未定义要求（电子）
Posted
技术标签:
【中文标题】未捕获的 ReferenceError：未定义要求（电子）【英文标题】：Uncaught ReferenceError: require is not defined (electron) 【发布时间】：2019-10-11 17:18:13 【问题描述】：我的 Electron 应用程序出现问题。大约 9 个月前我让它工作了，但现在我制作的自定义最小化和最大化按钮无法正常工作。
这是我的文件结构
node_modules
...
web
css
main.css
html
index.html
images
...
js
index.js
themes
...
main.js
package.json
package-lock.json
require.js
这里是index.html的内容
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../css/main.css">
<style type="text/css">* visibility: hidden;</style>
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700" rel="stylesheet">
<link rel="icon" href="../images/favicon-32x32.png" />
</head>
<body>
<div id="wrapper">
<div id="title-bar">
<div id="title-bar-btns">
<button id="min-btn" onclick="window_minimise()">—</button>
<button id="close-btn" onclick="window_close()">✕</button>
</div>
</div>
...
</div>
<script>
// You can also require other files to run in this process
require('../../renderer.js')
</script>
<script src="../js/index.js" type="text/javascript"></script>
</body>
</html>
还有index.js
...
const BrowserWindow = require('electron').remote;
function window_minimise()
let window = BrowserWindow.getCurrentWindow();
window.minimize();
function window_close()
let window = BrowserWindow.getCurrentWindow();
window.close();
...
这是我的main.js 文件
const app, BrowserWindow = require('electron')
let mainWindow
function createWindow ()
let mainWindow = new BrowserWindow(
width: 1200,
height: 748,
icon:'web/images/favicon-32x32.png',
resizable: false,
frame: false,
show: false,
backgroundColor: '#171717',
webPreferences:
nodeIntegration: true
)
mainWindow.once('ready-to-show', () =>
mainWindow.show()
)
mainWindow.setMenu(null);
mainWindow.loadURL('http://localhost:8000/html/index.html')
mainWindow.on('closed', function ()
mainWindow = null
)
app.on('ready', createWindow)
app.on('window-all-closed', function ()
if (process.platform !== 'darwin') app.quit()
)
app.on('activate', function ()
if (mainWindow === null) createWindow()
)
当我单击最小化或最大化时，没有任何反应。于是我去http://localhost:8000/html/index.html查看了控制台，看到了这些错误
未捕获的 ReferenceError: 要求未在 index.html:137 中定义
未捕获的 ReferenceError: 要求未在 index.js:110 中定义
顺便说一下，我使用的是电子版 5.0.2。
如果有人能帮我解决这个问题，那就太好了。
谢谢。
编辑：我上面提到的错误在页面加载时显示，当我点击最小化时显示此错误
未捕获的 ReferenceError：之前无法访问“BrowserWindow” 在 window_minimise (index.js:113) 处初始化 HTMLButtonElement.onclick (index.html:18)
EDIT2：我认为问题在于 eel（允许我将 python 与我的电子应用程序接口的代码）要求网页在 localhost 上运行，因此 require 等节点功能不起作用。我在这里的 GitHub 问题中更详细地介绍：github.com/ChrisKnott/Eel/issues/147
【问题讨论】：
看起来你可以找到答案here @TimofeyGoncharov 如果您阅读我的帖子，您会意识到我已经将 nodeIntegration 设置为 true 请提供完整版本的 index.js，因为错误是指该文件中的特定行 @GJCode 我已经提供了周围的行，包括错误所在的位置 你不能在普通浏览器中使用 require。 JS 在普通浏览器的沙箱中运行，并且 require 使用浏览器无法访问的文件系统。 electron 所做的是将您的应用程序包装在 chromium 浏览器中并在该沙箱之外运行 js，这就是为什么使用电子（和节点）您可以使用 require 和文件系统的原因。这是您在控制台上获取错误的方式，它们与您的问题无关 【参考方案1】：您需要做的就是在 webPreferences 对象中的 nodeIntegration: true 之后添加 contextIsolation: false
【讨论】：
此解决方案有效且最不笨重【参考方案2】：如下更改您的index.js 文件。然后使用nodeRequire 代替require 关键字。
initNodeRequire();
const BrowserWindow = nodeRequire('electron').remote;
function window_minimise()
let window = BrowserWindow.getCurrentWindow();
window.minimize();
function window_close()
let window = BrowserWindow.getCurrentWindow();
window.close();
function initNodeRequire()
window.nodeRequire = require;
delete window.require;
delete window.exports;
delete window.module;
【讨论】：
感谢您的回复，不幸的是，我仍然收到以下错误：Uncaught ReferenceError: require is not defined at index.html:137、Uncaught ReferenceError: require is not defined at initNodeRequire (index.js:123) at index.js:109，当我点击最小化时Uncaught ReferenceError: BrowserWindow is not defined at window_minimise (index.js:113) at HTMLButtonElement.onclick (index.html:18)。
虽然我不确定这一点，因为我认为require 是一个不会在浏览器中运行的节点事物，即使我通过 devtools for electron 查看控制台，那实际上只是 localhost 实例。即便如此，按钮仍然不起作用。
我认为问题在于 eel（允许我将 python 与我的电子应用程序接口的代码）要求网页在本地主机上运行，因此 require 等节点功能不起作用.我在这里的 GitHub 问题中更详细地介绍：github.com/ChrisKnott/Eel/issues/147以上是关于未捕获的 ReferenceError：未定义要求（电子）的主要内容，如果未能解决你的问题，请参考以下文章
Angular 2/webpack 中的“未捕获的 ReferenceError：未定义要求”
未捕获的 ReferenceError: 要求未在 app.js:3 中定义
未捕获的 ReferenceError：在 Angular 2 webpack 全局库安装中未定义要求
未捕获的 ReferenceError：未使用 react-chartjs.min.js 定义要求