添加 Realm/webpack-node-externals 库后在开发中运行 Electron/React 的问题答案

【问题标题】：Problems to run Electron/React in development after adding Realm/webpack-node-externals libs添加 Realm/webpack-node-externals 库后在开发中运行 Electron/React 的问题
【发布时间】：2022-10-07 01:59:46
【问题描述】：

我正在开发一个结合 ElectronJs 和 ReactJS 的桌面应用程序，更具体地说是 create-react-app。沿着我已经为离线操作开发的移动应用程序的路线，我选择使用RealDB进行数据存储。

https://www.mongodb.com/docs/realm/sdk/node/integrations/electron-cra/

按照文档和它自己的建议，我添加了 lib.我不得不对我的代码进行更改，例如在 create-react-app 中使用替代 craco，以使用 webpack-node-externals 库，但是在添加之后运行我的应用程序进行开发很无聊，我花了很多钱重新加载或重建的时间。

我发现最好的选择是将electronmon与nodemon结合起来，我使用nodemon来检测src文件中的更改，重新构建代码，以便在检测到构建文件夹中的更改时重新加载电子我使用electronmon，但我仍然失去了相当大的时间并且并不总是按预期工作

包.json：

{
  \"scripts\": {
    \"start\": \"electron .\",
    \"build\": \"craco build\",
    \"electron:start\": \"concurrently -k \\\"nodemon --watch ./src --exec npm run build\\\" \\\"wait-on ./build/index.html && electronmon .\\\"\",
    \"electron:package:mac\": \"npm run build && electron-builder -m -c.extraMetadata.main=build/electron.js\",
    \"electron:package:win\": \"npm run build && electron-builder -w -c.extraMetadata.main=build/electron.js\",
    \"electron:package:linux\": \"npm run build && electron-builder -l -c.extraMetadata.main=build/electron.js\"
  },
  \"eslintConfig\": {
    \"extends\": [
      \"react-app\",
      \"react-app/jest\"
    ]
  },
  \"browserslist\": {
    \"production\": [
      \"last 1 electron version\"
    ],
    \"development\": [
      \"last 1 electron version\"
    ]
  },
  \"electronmon\": {
    \"patterns\": [
      \"!default.realm.lock**\",
      \"!default.realm**\",
      \"!package.json**\"
    ]
  }
}

craco.config.js

const nodeExternals = require(\"webpack-node-externals\");

module.exports = {
  style: {
    postcss: {
      plugins: [require(\"tailwindcss\"), require(\"autoprefixer\")],
    },
  },
  webpack: {
    configure: {
      externals: [
        nodeExternals({
          allowlist: [/webpack(\\/.*)?/, \"electron-devtools-installer\"],
        }),
      ],
    },
  },
};

我想明确一点，代码工作正常，一切正常，领域工作，但我的开发性能受到了很大的伤害。我需要帮助以找到其他方法来让它运行，而不会浪费太多时间来重新加载应用程序

标签： reactjs electron realm create-react-app webpack-externals

【解决方案1】：

+1 我遇到了同样的“问题”

【讨论】：