Electron.js 错误“require”未在 index.html 的 <script> 标签中定义答案

【问题标题】：Electron.js Error "require" is not defined in <script> tag of index.htmlElectron.js 错误“require”未在 index.html 的 <script> 标签中定义
【发布时间】：2020-12-04 10:30:08
【问题描述】：

这不是与之前标题相似的问题的重复。请在尝试将其标记为重复之前阅读内容。很难用一句话标题来描述问题并将其与以前的问题区分开来。谢谢。

我有一个非常简单的 index.html，我想使用 node.js API 来读取文件

<body>
<h1>Hello World!</h1>
We are using node <script>document.write(process.versions.node)</script>,
Chrome <script>document.write(process.versions.chrome)</script>,
and Electron <script>document.write(process.versions.electron)</script>.

<!-- Jquery JS-->
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>

<script src="vendor/bootstrap-4.1/popper.min.js"></script>
<script src="vendor/bootstrap-4.1/bootstrap.min.js"></script>


<script>
    var fs = require('fs');

    fs.readFile('my-file.txt', 'utf8', function(err, data) {
        if (err) throw err;
        console.log(data);
    });
</script>
</body>

当我运行 'npm start' 时，出现错误

未捕获的引用错误：未定义要求在 index.html:49

由于我阅读了之前的一些问题，我确保在 main.js（主进程）中我将 nodeIntegration 设置为 true。

webPreferences: {
    nodeIntegration: true
}

我哪里做错了？我只是想实现一个非常简单的目标，即在 html 的标签中使用嵌入式 javascript 来读取文件，就是这样。谢谢。

【问题讨论】：

标签： javascript node.js electron

【解决方案1】：

您还应该将 contextIsolation 设置为 false，或者选择使用 preload.js

 new BrowserWindow({
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false
    }
  });

您可以从这里了解更多信息：https://www.electronjs.org/docs/tutorial/context-isolation

【讨论】：