前提：使用vue官方脚手架搭建（webpack）
使用 vue-cli构建的项目,在 默认情况下 ,执行 npm run build 会将所有的js代码打包为一个整体,这样打包使单页面的应用的体积比较大，浪费资源，通常的做法使用按需加载，以节约资源。
写法：const Foo = r => require.ensure([], () => r(require('./Foo.vue')), 'group-foo')
require.ensure
1.语法: require.ensure(dependencies: String[], callback: function([require]), [chunkName: String])
- dependencies: 依赖的模块数组
- callback: 回调函数，该函数调用时会传一个require参数
- chunkName: 模块名，用于构建时生成文件时命名使用
2.说明: require.ensure在需要的时候才下载依赖的模块，当参数指定的模块都下载下来了（下载下来的模块还没执行），便执行参数指定的回调函数。require.ensure会创建一个chunk，且可以指定该chunk的名称，如果这个chunk名已经存在了，则将本次依赖的模块合并到已经存在的chunk中，最后这个chunk在webpack构建的时候会单独生成一个文件。
3.在执行cnpm run dev 后chunk会被生成一个单独的js文件，当路由被访问的时候才加载对应chunk组件，这样就更加高效了。
参考：官方 https://router.vuejs.org/zh-cn/advanced/lazy-loading.html
