React多级路由懒加载问题
Posted wurijie
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了React多级路由懒加载问题相关的知识，希望对你有一定的参考价值。
React启用懒加载后，react-router使用BrowserRoute模式，二级路由页面加载其他页面时会报错“找不到相应的chunk文件”。
如页面demo/A中懒加载demo/B，会报错“react-dom.development.js:13035 Uncaught ChunkLoadError: Loading chunk B failed.”。查看network请求发现懒加载B时的js请求路径为demo/B/js/chunkName.js，而webpack打包后的统一放在了路径dist/js下，故找不到对应的chunkName.js。
解决方法：
1.将react-router的模式改为HashRouter，由于采用#hash来实现路由，请求的chunkName.js路径永远在/js路径下。
2.修改webpack的output参数，添加publicPath属性为“/”，这样所有的资源引用都将使用绝对引用方式，在多级路由下也能正常工作。
以上是关于React多级路由懒加载问题的主要内容，如果未能解决你的问题，请参考以下文章