Question

我正在努力学习React以及围绕它构建的整个环境。我通过尝试构建自己的开发堆栈来做到这一点。

我长时间无法理解的问题是如何在不失去服务器渲染能力的情况下提供CSS /图像。

我已经阅读了几个教程并发现了webpack-isomorphic-tools

我已配置它们并设法获得支持的图像，sass（转换为css）。

但是，我遇到了一个问题，即我的webpack-assets.json文件没有生成，而是看到了这个输出。（I managed to get it generated on a 2nd run of npm start before this commit, but that was definitely not a way to go，但它显示插件在文件存在时有效。）

$ npm start

> redux-universal-example@0.0.0 start /Users/janvorcak/learning2016
> node src/server/index.js

[webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
[webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
[webpack-isomorphic-tools] (waiting for the first Webpack build to finish)
[webpack-isomorphic-tools] (waiting for the first Webpack build to finish)

我理解这个文件的目的，但我无法弄清楚为什么它根本没有生成。

有什么我想念的吗？以下是相关文件和存储库

https://github.com/jvorcak/universal-react-kit/tree/sass-loader （我的universal-react-kit存储库上的sass-loader分支）
配置 - https://github.com/jvorcak/universal-react-kit/blob/sass-loader/webpack-isomorphic-tools-configuration.js
webpack.config.js - https://github.com/jvorcak/universal-react-kit/blob/sass-loader/webpack.config.js
运行服务器时的条目文件https://github.com/jvorcak/universal-react-kit/blob/sass-loader/src/server/index.js

有人可以解释一下发生了什么，我已经阅读了文档，博客，但我在这里遗漏了一些东西。谢谢。

Answer 1

未生成资源文件的原因是您已将webpack-dev-server集成到server.js。

https://github.com/jvorcak/universal-react-kit/blob/master/src/server/server.js#L81

这是一种错误的方法，因为在制作中你不需要webpack-dev-server，因此它的位置在其他地方。

在您的情况下，webpack-dev-server用于生成webpack-assets.json，此webpack-dev-server在 webpack-isomorphic-tools .server()方法调用后正在运行它的回调，但在找到webpack-assets.json之前不会调用它的回调。

答案是在一个单独的过程中运行webpack-dev-server（您可能需要参考github.com/erikras/react-redux-universal-hot-example以获取如何实现该过程的示例）。

https://github.com/halt-hammerzeit/webpack-isomorphic-tools/issues/47

您可能也喜欢我自己的样板，可以做所有花哨的事情

https://github.com/halt-hammerzeit/webapp

无法使用webpack-isomorphic-tools生成webpack-assets.json

1 个答案: