Phonegap 和 React 应用程序的 Webpack 配置？

Question

我正在使用 Phonegap 构建此 android/iOS 应用程序，它将基于 React（而非 React Native）构建。我根据自己的需要配置了 webpack，当我运行 npm 运行构建时，Phone 中的 android 应用程序查看器正确呈现应用程序。但问题是，如果我更改 webpack 提供的 www 文件夹中的任何文件，Phonegap 服务器会获取更改，但在 android 查看器中不会 re-render 观点。

知道如何使用 webpack 简化整个过程，以便 Phonegap phone 应用程序可以获取 webpack 提供的内容，否则 webpack 会吐出www 文件夹中的文件和 Phonegap 服务器会选择它并在它自己的服务器或 Phonegap android 应用程序中呈现视图？

这是我的文件夹结构-

Phonegap 正在将文件从 www 传送到我的 android phone。但是，当我在那里手动更改任何文件时，Phonegap 会获取更改，但页面不会 re-render 在 phone.

上编辑

同时，当我从 src 保存文件并进行新更改时，如何配置 webpack 以动态更改构建文件夹 'www'？以便 Phonegap 接受更改并重新渲染？

Answer 1

在 webpack 配置文件中，将输出目标设置为您的 www 文件夹。这是我如何让它工作的示例：

entry: './src/index',
output: {
  path: path.resolve(__dirname, 'www'),
  filename: '[name].bundle.js',
  hotUpdateChunkFilename: 'hot/hot-update.js',
  hotUpdateMainFilename: 'hot/hot-update.json',
},

因此，您捆绑的 .js 文件将被插入到 www/ 或 www/js/ 或您需要的任何地方，并且 phonegap serve 将获取更改。

我还使用了 webpack-dev-server 和 write-file-webpack-plugin 所以前者实际上会写入 main.bundle.js 文件但是我遇到了一些问题，热替换发生得太慢，phonegap 正在挑选临时插入然后删除的热文件，phonegap 服务崩溃，因为最终找不到这些临时文件。现在正在尝试 webpack -w。

Phonegap 和 React 应用程序的 Webpack 配置？

Webpack configuration for Phonegap and React app?

android

cordova

reactjs

webpack

phonegap