折腾到大半夜,项目终于升级成功了。(源码地址在最下面,往下看。。)
webpack2在一些细节上的变化导致不能使用webpack1的配置模式,我参考了github上一个demo之后结合自己的第一个react项目版本的项目做了升级。
react、react-dom、react-redux统统全面升级版本。
react-router也升级到了最新版4.0.0,API发生了较大的变化,路由结构也做了调整,最新版router支持更多强大的功能 react-router4官方教程
下面的代码是截取本项目的一段router。
export default (
<HashRouter>
<App>
<Match exactly pattern="/" component={Home} />
<Match pattern="/search" component={Search} />
{/*在这里添加你的Route*/}
</App>
</HashRouter>
再来看看webpack2的一段配置
module: {
rules: [
{
test: /\.css$/,
exclude: /node_modules/,
use: ['style-loader', 'css-loader']
},
{
test: /\.less$/,
use: ['style-loader', "css-loader", "less-loader"]
},
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: ['babel-loader'],
}
],
}
webpack2—react-router4项目地址:https://github.com/hyy1115/react-redux-webpack2
过几天有时间的话会写几篇博客总结一下webpack2和react-router4的配置方法,现在国内也有介绍这些的博客,百度也能搜索到。