Question

我刚开始在我的第一个电子应用程序上工作，并导入了一些使用net模块的现有代码。当我从电子应用程序导入代码时，net模块将返回一个空对象。

const net = require('net'); // => {}

我以为电子束节点与所需的本机模块一起，所以我对为什么导入无法正常工作感到困惑。

编辑：我已经用vue-cli-tools引导了应用程序，因此它正在使用Webpack捆绑依赖项。不确定这是否重要。

Answer 1

我认为电子束节点与所需的本机模块一起

确实如此，但是将浏览器运行时和node.js运行时捆绑在一起仍然会使您拥有两个不同的运行时。

了解Main and Renderer processes之间的区别对于电子发展至关重要。

Main进程在Node.js运行时上运行，并且可以访问Node.js API（例如net）。

Renderer进程在Chromium上运行，并且可以访问浏览器API（例如DOM）。

您无法从客户端Vue代码访问net，因为它正在Renderer进程中运行。

您需要在Main进程中创建一个服务，并在它与Renderer中运行的某些事物之间交换数据。

通常使用IPC apis完成。

// In main process.
const { ipcMain } = require('electron')
ipcMain.on('message-from-browser', (event, arg) => {
  const something = doSomethingWithNetModule()
  event.reply('reply-to-browser', something)
})

和

// In renderer process (web page).
const { ipcRenderer } = require('electron')

ipcRenderer.on('asynchronous-reply', (event, arg) => {
    doSomethingWithDataFromNetModule(arg)
})

ipcRenderer.send('message-from-browser', 'do something with the net module please')

请注意，由于您使用的是Webpack，因此require("electron")会出现问题，in this question将会对此进行解释。

Answer 2

Weback可能正在尝试捆绑net。尝试两件事：

在vue.config.js中，使用webpack配置外部选项。（请注意，您可以在下面的选项中使用commonjs2，有关更多信息，请参见externals文档）

module.exports = {
  configureWebpack: {
    externals: {
      net: 'commonjs net',
    }
  },
}

或者（不建议使用，但是过去在找到正确的Webpack设置时很顽固），请重命名require，以便Webpack忽略它：

const _require = require;
//...
const net = _require('net');

电子：NodeJS的“ net”模块返回空对象

2 个答案: