在react-router4中进行代码拆分的方法（基于webpack）

随着前端项目的不断扩大，一个原本简单的网页应用所引用的js文件可能变得越来越庞大。尤其在近期流行的单页面应用中，越来越依赖一些打包工具，通过这些打包工具将需要处理、相互依赖的模块直接打包成一个单独的bundle文件，在页面第一次载入时，就会将所有的js全部载入。代码拆分的核心目的，就是实现资源的按需加载。而要动态加载js资源的方式也非常简单。例如对于原有的模块引入import react from 'react'可以写为import。但是需要注意的是，import()会返回一个Promise对象。当然，也可以再加入一些异常处理：当然，由于import()会返回一个Promise对象，因此要注意一些兼容性问题。可以看到，动态import()的方式不论在语意上还是语法使用上都是比较清晰简洁的。