公司项目使用的是webpack1,使用extract-text-webpack-plugin 插件无法将css分离出来,检查原因,发现有如下代码

<Route path="/home" component={require('react-router!./containers/home')}></Route>

经过react-router处理过的文件无法提取出样式,将代码修改为

<Route path="/home" component={require('./containers/home')}></Route>

这时css被提取出来,但是报出如下错误

webpack 样式分离之The root route must render a single element

查阅资料,发现问题所在

因为 module.exports 和 ES6 里的 export default 有区别。

如果是用 es6 的写法,组件都是通过 export default 导出的,那么在 getComponent 方法里面需要加入 .default。

如果是用 CommonJS 的写法,也就是通过 module.exports 导出的,那就无须加 .default 了。

修改代码后,问题解决

<Route path="/home" component={require('./containers/home').default}></Route>

相关文章:

  • 2021-11-24
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-07-23
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-08-03
  • 2021-09-08
  • 2021-11-26
  • 2021-11-14
相关资源
相似解决方案