Electron使用nodejs的坑，Can‘t resolve ‘child_process‘错误

原创已于 2022-08-29 13:22:26 修改 · 3.3k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#electron #javascript #前端

于 2022-08-14 13:51:39 首次发布

本文介绍如何在Electron项目中正确配置Node.js环境，以便使用child_process模块启动外部应用程序。通过调整webPreferences选项和使用正确的require方法，解决启动过程中出现的问题。

child_process模块能够帮助我们调用cmd，当我整合到electron项目中时，遇到的相关错误如下.

使用vue-cli脚手架+electron-builder的方式创建的electron项目。

使用npm run electron:serve启动服务时报错:

./src/utils/open.js的代码如下，直接使用node ./src/utils/open.js命令时可以正常启动微信程序（注意自己使用时的路径问题）

var { exec } = require('child_process')

exec('start "" "C:\\Program Files (x86)\\Tencent\\WeChat\\WeChat.exe"'), function (err, stdout, stderr) {

console.log('ok')

if (err) {

throw err;

}

}

检查后发现require应该使用window.require,也就是将上述第一句修改为:

var { exec } = window.require('child_process')

但是需要注意，如果是使用vue-cli+electron-builder创建的项目(顺带一提，此方法只需两步，一、vue create 文件名；二、vue add electron-builder)，你的background.js中会有以下代码

const win = new BrowserWindow({

    width: 1100,

    height: 800,

    webPreferences: {

  
       nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,

       contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,



    }

  })

webpreferences中需要修改,修改结果如下：

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

其本身是允许使用nodejs相关的代码，如果使用原来的代码，会报window.require is not defined，如果是自己搭建结构的话，new BrowserWindow里不要忘了加上webPreferences这个配置项。

修改后，就可以在electron程序中正常启动了。