Question

我有一个在Electron.js中创建的项目。它使用简单的HTML文件。但是现在我想将此应用程序转换为React应用程序。直接使用HTML文件时，我可以使用electron之类的节点模块，需要主app.js文件以及所有文件。使用webpack构建项目后，React应用程序将转换为静态文件。那么构建后如何访问节点模块？

Answer 1

我建议您在项目中使用Electron-React boilerplate。因为它包含了构建电子反应项目的所有基本配置。浏览electron-react docs并设置一个初始的电子反应应用程序。

# First, clone the repo via git:
git clone --depth=1 https://github.com/electron-react-boilerplate/electron-react-boilerplate.git your-project-name
cd your-project-name
# And then install dependencies with yarn:
yarn

dependencies的{{1}}上列出的所有模块都将在生产阶段捆绑在一起。因此，相关模块也可以在构建阶段进行访问。您可以使用html文件创建组件。

确保在package.json上启用nodeIntegration，以便渲染器进程可以访问节点模块。

BrowserWindow

Answer 2

您可以使用electron-jsx软件包进行工作（我是该软件包的作者），简单易行

仅在index.html文件中需要它：

<script>
require("electron-jsx")(__dirname, {
    reactDir: "./react-sources",
})
</script>
<script react-src="./react-sources/index.jsx">

您可以使用正常的react（没有webpack）工作，此外，您可以调用任何带有ES6导入的节点包进行react

该软件包的更多信息和文档：

https://www.npmjs.com/package/electron-jsx

https://github.com/mdjfs/electron-jsx

PD：您还需要将nodeIntegration设置为true

生产构建后如何在React App中使用节点模块？

2 个答案: