我正在尝试学习 React 以及围绕它构建的整个环境。我通过尝试构建自己的开发堆栈来做到这一点。
我很长一段时间无法解决的问题是如何在不失去服务器渲染能力的情况下提供CSS/图像服务。
我读了一些教程并发现了webpack-isomorphic-tools
我已经配置了它们并设法获得支持的图像,sass(转换为 css)。
但是,我遇到了一个问题,即我的
webpack-assets.json
文件未生成,而是看到了此输出。 (在这次提交之前,我设法在第二次运行npm start
时生成了它,但这绝对不是一个可行的方法,但它表明该插件在存在文件时可以工作。)
$ npm start
> [email protected] 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)
我理解这个文件的用途,但我真的不明白为什么它根本没有生成。
我有什么遗漏的吗? 这是相关文件和存储库
universal-react-kit
存储库上的 sass-loader 分支)有人可以解释一下发生了什么事吗?我读过文档、博客,但我在这里遗漏了一些东西。谢谢。
资产文件未生成的原因是因为您已将
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
正在运行 after 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
您可能也喜欢我自己的样板,它可以做所有奇特的事情