一. react服务端渲染实现流程
1、输入url网址向服务器请求页面
2、服务器接收请求，从数据库获取数据与静态资源，渲染到html中返回
- 服务器端需要安装react相关来将react组件转为html字符串
- 服务器端需要安装webpack使资源文件可以引入node环境中
3、前段获取html后渲染到浏览器，请求html中静态资源后进行二次渲染
4、服务端渲染组件部分js需要单独放在一个目录下，通过一个出口提供模板字符串，webpack只打包该目录下的内容
output的libraryTarget属性决定了输出文件被其他目录的引用方式(commonjs2可以通过require引入，具体看官方文档)
二. 环境搭建
1、服务器环境express
2、webpack下配置ES6环境与资源加载
- 配置babel：.babelrc配置文件实现ES6环境支持
- 配置webpack: webpack.config.js文件，配置css style babel的loader安装
以及babel-core babel-preset-es2015 babel-preset-react等核心模块安装
3、loader是按照顺序对entry进行执行的，如果loader之间存在冲突会报错
babel已经包含jsx-loader所需模块，jsx由于无法解析import导致执行webpack报错
网友评论