在Electron + React + Webpack设置中找不到模块'electron‘

Question

我正在使用React + Electron + Webpack创建一个应用程序，但在尝试使用Electron模块时，我收到错误消息“找不到模块'electron‘。

我在我的一个React组件中有以下示例代码：

const shell = window.require("electron").shell;
shell.showItemInFolder("C:\\Logs");

我已经提到了许多问题，所以提出了与webpack电子，但似乎没有一个解决方案对我有效。

当我尝试下面的代码时：

require('electron-prebuilt')

它返回电子可执行文件的路径。

Answer 1

在webpack的配置中有一个target选项，需要设置为electron。如下所示：

var config = {
    target: 'electron',
    entry: __dirname + '/main.js',
    output: {
        path: __dirname + '/dist/',
        filename: 'bundle.js'
    },
    ...
};

module.exports = config;

Answer 2

在webpack中，你可以设定发展目标。默认情况下，目标将设置为web。因此，您需要在渲染器进程中将目标设置为electron-renderer，在主进程中将目标设置为electron-main。

//In the renderer configuration
module.exports = {
 target: 'electron-renderer',
 //... other configurations
}

//In the main configuration
module.exports = {
 target: 'electron-main',
 //... other configurations
}

electron和atom是电子主干的别名