使用 electron-builder 和 webpack 在 main.js 中使用 node-modules答案

【问题标题】：Using node-modules in main.js using electron-builder and webpack使用 electron-builder 和 webpack 在 main.js 中使用 node-modules
【发布时间】：2017-07-27 21:14:06
【问题描述】：

首先我不知道我遇到的问题是因为 webpack 还是 electron-builder 或两者兼而有之。

解决问题。当我为开发而构建时，我可以在我的 package.json 文件{"main" : "app/main.js"} 中指定的 main.js 文件中使用已安装的节点模块。

但是，当我使用电子生成器创建安装程序时。当我使用安装程序安装应用程序时，我在启动应用程序时收到以下错误消息：

我的猜测是我收到此消息是因为 main.js 找不到所需的节点模块。那么如何让它们可用呢？

我希望有人比我更聪明，我们更擅长谷歌搜索:)

Package.js：

{
  "main": "app/main.js",
  "scripts": {
    "hot-server": "node hot-server.js",
    "build-bundle": "rimraf app/dist.release && better-npm-run build-bundle",
    "start": "better-npm-run start",
    "start-hot": "better-npm-run start-hot",
    "backend": "node backend-dummy.js",
    "dist-win": "npm run build-bundle && rimraf dist && build --win --ia32",
    "dist-mac": "npm run build-bundle && rimraf dist && build --mac"
  },
  "betterScripts": {
    "start": {
      "command": "electron ./",
      "env": {
        "NODE_ENV": "production"
      }
    },
    "start-hot": {
      "command": "electron ./",
      "env": {
        "HOT": 1,
        "NODE_ENV": "development"
      }
    },
    "build-bundle": {
      "command": "webpack --config webpack.config.production.js --progress --profile --colors",
      "env": {
        "NODE_ENV": "production"
      }
    }
  },
  "bin": {
    "electron": "./node_modules/.bin/electron"
  },
  "build": {
    "appId": "app",
    "files": [
      "dist.release/*",
      "dist.resources/*",
      "main.js",
      "thirdparty/*",
      "app.html"
    ],
    "extraFiles": [
      "lang/*",
      {
        "from": "build/extra",
        "to": "./",
        "filter": "**/*"
      }
    ],
    "asar": true
    }

【问题讨论】：

你在使用 Electron-packager 吗？另外，你的 package.json 的 devDependencies 部分有电子日志吗？
不，我不使用 Electron-packager。我在依赖项中有电子日志和电子更新器。
经过一番深入研究后，我认为这与我所有的节点模块都使用 browserify 打包并隐藏在该捆绑包中有关。所以我想我有两个选择，要么设法在我的包之外添加所需的节点模块，要么在我的包中访问它们。
我很确定当您使用 electron-builder 时 devDependencies 不会包含在构建中，但我目前无法确认。因此，如果它是一个开发依赖项，它将被修剪掉。 Webpack 与 bundle 没有任何关系，因为通常你会在 webpack 配置中排除节点模块。

标签： javascript node.js webpack electron electron-builder

【解决方案1】：

所以我找到了解决问题的方法。我所做的是我查看了这个项目： https://github.com/chentsulin/electron-react-boilerplate

他们有一个特殊的 webpack.config.electron.js 文件，它将 main.development.js 文件的所有 node_modules 捆绑到一个包含我们需要的一切的 main.js 文件中。然后当电子程序启动时，它使用这个 main.js 包来运行。要做到这一点，你需要在你的 package.json 文件中添加一个构建脚本来执行 webpack.config.electron.js。

我认为通过查看链接的项目比我解释更容易理解如何解决它。

【讨论】：