Question

我刚刚开始学习 JS/react，我从一个 html 文件中收到一个错误，抱怨“未捕获的 ReferenceError：需要未定义”。请参阅下面的示例。

错误来自第 8 行

<块引用>

    const electron = require('electron');

来自以下代码

this is addWindow.html
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Add shopping list item</title>
</head>
<body>
  <script>
    const electron = require('electron');
    const {ipcRenderer} = electron;

    const form = document.querySelector('form');
    form.addEventListener('submit', submitForm);

    function submitForm(){
      e.preventDefault();
    }
  </script>
  <form> 
    <div>
      <label>Enter Item</label>
      <input type="text" id="item" autofocus>
    </div>
    <button type="submit">add item</button>
  </form>

</body>
</html>

我已经研究并注意到很多其他人都遇到了这个问题，所以我添加了

<块引用>

  nodeIntegration: true,

this is main.js
const electron = require("electron");
const url = require("url");
const path = require("path");

const { app, BrowserWindow, Menu } = electron;

let mainWindow;
let addWindow;

//listen
app.on("ready", function () {
  //create new window
  mainWindow = new BrowserWindow({
    webPreferences: {
      nodeIntegration: true,
      preload: `${__dirname}/preload.js`,
    },
  });

  //
  mainWindow.loadURL(
    url.format({
      pathname: path.join(__dirname, "mainWindow.html"),
      protocol: "file:",
      slashes: true,
    })
  );
  //Quit app when closed
  mainWindow.on("closed", function () {
    app.quit();
  });

  //build menu from template
  const mainMenu = Menu.buildFromTemplate(mainMenuTemplate);
  //insert menu
  Menu.setApplicationMenu(mainMenu);
});

//handle add window
function createAddWindow() {
  //create new window
  addWindow = new BrowserWindow({
    width: 300,
    height: 200,
    title: "Add shopping list item",
    webPreferences: {
      nodeIntegration: true,
      preload: `${__dirname}/preload.js`,
    },
  });

  //
  addWindow.loadURL(
    url.format({
      pathname: path.join(__dirname, "addWindow.html"),
      protocol: "file:",
      slashes: true,
    })
  );

  //garbage collection
  addWindow.on("close", function () {
    addWindow = null;
  });
}

//add clear quit

//create menu template
const mainMenuTemplate = [
  {
    label: "la",
  },
  {
    label: "File",
    submenu: [
      {
        label: "Add Item",
        accelerator: process.platform == "darwin" ? "Command+A" : "Ctrl+A", //mac for darwin
        click() {
          createAddWindow();
        },
      },
      {
        label: "Clear Item",
      },
      {
        label: "Quit",
        accelerator: process.platform == "darwin" ? "Command+Q" : "Ctrl+Q", //mac for darwin
        click() {
          app.quit(); //control Q
        },
      },
    ],
  },
];

if (process.platform == "darwin") {
  // mainMenuTemplate.unshift({});
}

// add dev tool item if not in prod
if (process.env.NODE_ENV !== "production") {
  mainMenuTemplate.push({
    label: "Developer Tools",
    submenu: [
      {
        label: "Toggle DevTools",
        accelerator: process.platform == "darwin" ? "Command+I" : "Ctrl+I",
        click(item, focusedWindow) {
          focusedWindow.toggleDevTools();
        },
      },
      {
        role: "reload",
      },
    ],
  });
}

但我仍然没有运气。你能帮我吗？

谢谢。

Answer 1

您是否尝试过此解决方案？ :

const ipcRenderer = window.require("electron").ipcRenderer;

原文链接：https://github.com/electron/electron/issues/7300#issuecomment-671846484

Answer 2

我觉得你的代码需要先反编译，这是我的node.js项目的package.json的scripts部分，也许对你有用：

"scripts": {
    "build": "rm -rf dist && babel ./ -d dist --ignore 'node_modules'",
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "nodemon --exec babel-node src/index.js",
    "serve": "node ./dist/index.js"
  }

React/JS Uncaught ReferenceError: require is not defined

2 个答案: