生產構建后如何在反應應用程序中使用節點模塊？

Question

我有一個在 Electron.js 中創建的項目。 它使用簡單的 HTML 文件。 但是現在我想把這個應用程序轉換成一個 React 應用程序。 在直接使用 HTML 文件時，我可以使用像electron這樣的節點模塊，需要主app.js文件和所有文件。 使用 webpack 構建項目后，React 應用程序將轉換為 static 文件。 那么構建后如何訪問節點模塊呢？

Answer 1

我建議你為你的項目使用Electron-React 樣板。 因為這包含構建電子反應項目的所有基本配置。 Go 通過電子反應文檔並設置初始電子反應應用程序。

 # 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

package.json的dependencies中列出的所有模塊將在生產階段捆綁。 因此也可以在構建階段訪問相關模塊。 您可以使用 html 文件創建組件。

確保在BrowserWindow上啟用nodeIntegration ，以便渲染器進程可以訪問節點模塊。

webPreferences: {
            nodeIntegration: true
}

Answer 2

你可以使用 electron-jsx package 來工作（我是包的作者），簡單易行

只有你需要在 index.html 文件中：

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

而且您可以使用 react normal（沒有 webpack），此外，您可以使用 ES6 導入調用任何節點 package 進行反應

package 的更多信息和文檔：

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

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

PD：您還需要將 nodeIntegration 設置為 true