标签: webpack-isomorphic-tools

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

我无法在很长一段时间内遇到的问题是如何在不失去服务器渲染能力的情况下提供CSS /图像.

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

我已配置它们并设法获得支持的图像,sass(转换为css).

但是,我遇到了一个问题,我的webpack-assets.json文件没有生成,而是看到了这个输出.(我设法npm start在此次提交之前的第二次运行时生成它,但这绝对不是一种方法,但它表明插件在文件存在时有效.)

$ 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

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

我已经阅读了有关同构应用程序开发的内容,并且我已经看到了在服务器端处理资源加载的方法.
一个是webpack-isomorphic-tools.
另一个是"hack",你在webpack中定义一个插件,它将process.env.BROWSER设置为true,并根据该变量加载资源.即:

if(process.env.BROWSER){
  require('./styles.scss');
}

我想知道,哪个更好,为什么？