我有以下npm脚本：
"build:server:dev": "webpack --config ./webpack.server.dev.config.js --watch",
"build:client:dev": "webpack --config ./webpack.client.dev.config.js --watch",
"build:server:prod": "webpack --config ./webpack.server.prod.config.js",
"build:client:prod": "webpack --config ./webpack.client.prod.config.js",
"start:server:prod": "export NODE_ENV=production && node ./dist/server.*.js",
"start:iso:dev": "export NODE_ENV=development && npm run build:client:dev & npm run build:server:dev",
"start:iso:dev:win": "set NODE_ENV=development && concurrently --kill-others \"npm run build:client:dev\" \"npm run build:server:dev\"",
"start:iso:prod": "npm run build:client:prod && npm run build:server:prod && npm run start:server:prod"
我面临的问题是服务器编译取决于客户端编译（我生成了一个html模板，在其中将带有webpack的脚本注入到客户端上，并将此模板用于服务器脚本中的服务器渲染）。
在几乎所有情况下，客户端都会在服务器之前完成编译，但是在同时运行这些脚本时，无法确保始终如此。
在运行webpack监视模式时，无法依次运行这些脚本，因为监视模式将阻止第二个脚本运行。
在我看来，最明显的解决方案是在没有监视模式的情况下编译它们一次，然后在初始编译后立即附加监视模式。
不过，我不确定如何实现此目的，并且我不想将它们编译两次，只是为了附加监视模式。
我想到的第二个选择是摆弄webpack progress插件，并在客户端脚本完成后以某种方式编译服务器脚本。
我不喜欢这种解决方案，因为我不想将一个脚本硬耦合到另一个脚本。
有没有办法在使用webpack --watch模式时从npm脚本顺序运行客户端和服务器编译？
答案 0 :(得分：0)
也许这对您parallel-webpack有帮助，尽管我没有尝试过它具有监视模式，并且可能只需要以这种方式为服务器端和客户端连接您的配置：
constructing C
constructing A
c.x = "X"
oops: 'C' object has no attribute '_internalX'
答案 1 :(得分：0)
我尚未真正实现此功能，但从理论上讲，我认为以下方法应该可行。
所以我会：
--> webpack client compile (without webpack --watch)
--> webpack server compile
--> watch ./client/index (--> recompile) running in parallel
问题是，一旦编译一次，我不确定如何附加webpack --watch模式。
建议不要在初始客户端编译后再次运行webpack --watch，而是建议使用其他npm包来监视文件系统更改，并运行自定义JS脚本，该脚本通过代码执行webpack编译器。
这解决了初始编译的问题。对于以后的代码更新，这仍然不能解决实际的问题，即客户端更新是否在服务器之前完成（尽管我发现我的更新目前可以在100％的情况下运行）。
我创建了一个手动实现以热刷新和自动刷新浏览器：
https://github.com/kimgysen/isomorphic-react-setup
我的想法是，您可以在此处创建自定义实现：
if (module.hot) {
module.hot.accept('./server', async () => {
可以在此处检查当前客户端脚本的编译是否完成。
尽管这在源代码中还是一个样板，所以尽管我确信它可以完成，但我并不特别喜欢这种解决方案。
另一方面，我认为这是针对该功能的自定义补丁，而负责此任务的工具（至少我知道）没有提供该功能，因此我认为这样做是可以的暂时找到更好的解决方案。
答案 2 :(得分：0)