webpack - Electron 网络构建策略

Question

我正在构建一个 Electron 应用程序。在开发过程中，我发现使用浏览器进行实现、调试和测试非常高效。但是，当使用任何 Electron 特定模块(remote.require、ipc 等)时，webpack 无法构建 js。

处理此类案例的最佳做法是什么？

我有 2 个 Webpack 配置，一个用于 Web，一个用于 Electron，其中我指定了 target=Electron，效果很好似乎网络版本(没有这个目标)，对 Electron 模块的提示

下面是一个示例模块，我有条件地尝试需要 Electron ，但 webpack 尝试将它包含在网络中

const isElectron = (function(){
    return navigator.userAgent.indexOf("Electron") == -1;
})();


export default {
    require: (module) => {
        if(isElectron){
            const electron = require("electron");
            return electron.remote.require(module);
        }
        return require(module);
    }
}

我什至添加了

但是，当 webpack 运行时我得到

ERROR in ./~/electron/index.js
Module not found: Error: Cannot resolve module 'fs'

如果我删除 Electron 要求，它就会消失

还有人遇到过这样的情况吗？

问候

Answer 1

据我所知，您无法从渲染器访问fs，只能从main访问。我解决这个问题的方法是在我的主进程中定义 fs 并使用共享对象使其可访问:


//主要的
全局.sharedObject = {
cwd:__目录名，
appDir: app.getPath('userData')
};


和


//渲染器
console.log(electron.remote.getGlobal('sharedObject').cwd);


根据您的情况，您可能会:

• 利用诸如electron-json-storage之类的东西
• 在 main 中定义所有路径并通过共享对象访问它们
• 使用IPC调用fs相关操作。