使 webpack 和 CRA 在监视模式下发出文件

Question

我正在尝试让CRA 的start脚本在更改时发出文件，而不是将它们保留在内存中。

我正在努力实现 Google Chrome 扩展，因此我需要将文件刷新到文件系统，以便 Chrome 可以获取它们。并且构建每个更改并不像自动编译那么方便。

我尝试使用react-app-rewired重写 webpack 配置中的一堆属性，包括mode、watch和 查看“output.path”，但到目前为止还没有运气。

或者 CRA 的“启动”脚本永远不会发出底层代码，因为加载程序没有进行调整来执行此操作？

感谢你的帮助！

Answer 1

我知道这个问题已经得到解答，是的，几个月前这对我也有用

但最近我开始了一个新项目，我想将一个 React 应用程序与 Express 结合起来，我尝试使用相同的设置，突然出现以下错误：

Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'writeToDisk'. These properties are valid:
   object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, server?, setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }
error Command failed with exit code 1.

由于这个质量检查当时对我有帮助，所以我决定将我在这里找到的内容分享给将来阅读本文并遇到相同错误的任何人。

解决方案

webpack 配置“devserver”结构似乎有一些更改，您可以在这里找到： https: //webpack.js.org/configuration/dev-server/

您不能再直接使用 writeToDisk ，需要将其放入devMiddleware对象中，如下所示：

Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'writeToDisk'. These properties are valid:
   object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, server?, setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }
error Command failed with exit code 1.

我在用：craco: ^6.4.3

我希望这可以帮助那些和我遇到同样问题的人