webpack - Electron 网络构建策略

标签 webpack electron

我正在构建一个 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 要求,它就会消失

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

问候

最佳答案

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

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

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

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

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

关于webpack - Electron 网络构建策略,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40785339/

相关文章:

javascript - PhpStorm调试器: How to ignore webpack dev server served script (node_modules)

vue.js - 找不到模块 '@/assets/<file-name-here>.svg'。 @vue/cli 版本 : 4. 2.3 和 4.3.1

javascript - React - 不变量违规 : Minified React error #130. 仅在生产中

javascript - Quill JS 模块在 Electron 中不工作

javascript - 客户端对 Electron 应用程序的 http 请求

Firefox开发人员工具不适用于Webpack CSS源映射

javascript - 使用 System.import 或 require.ensure 响应代码拆分和服务器端渲染

javascript - 如果主窗口隐藏,router.push electro-vue 将不起作用

javascript - Electron 桌面应用程序文件结构

reactjs - Electron-builder 错误 - fatal error : Unable to commit changes