上一次我们实现了模块的渲染和模块内的资源的加载，但是我们并没有真正实现组件的异步加载。
1.什么是异步组件？
异步组件就是定义的时候什么都不做，只在组件需要渲染（组件第一次显示）的时候进行加载渲染并缓存。
三种应用场景：
- Components;
- Router;
- Vuex modules.
Lazy Loading in Vue using Webpack's Code Splitting
下面主要设计vue components中的应用
2.Vue实现按需加载
Vue实现按需加载，官方推荐使用结合webpack的代码分割功能进行。定义为异步加载的组件，在打包的时候，会打包成单独的js文件存储在static/js文件夹里面，在调用时使用ajax请求回来插入到html中。
3.webpack的代码分割,AMD规范
这里的require是AMD规范的引入关键词，resolve是全部引入成功以后的回调函数，第一个参数是依赖，require会先引入依赖模块，再执行回调函数。
const HelloJs =(resolve)=>require(['@/components/HelloJs'],resolve)
components:{
HelloJs
}
4.webpack 2 + ES2015(推荐)
推荐使用，但是webpack > 2.4。这里的import()方法由es6提出，import()方法是动态加载，返回一个Promise对象，then方法的参数是加载到的模块。
const HelloJs =()=>import('@/components/HelloJs')
components:{
HelloJs
}
使用import()能够在加载模块失败时进行错误处理，因为返回的是个Promise（基于promise）
5.webpack的另一种代码分割
webpack编译时，会静态的解析代码中的require.ensure()，同时将模块添加到一个分开的chunk中，新的chunk会被webpack通过jsonp来按需加载。此方法内部依赖于Promise。
require.ensure(dependencies: String[], callback: function(require), chunkName: String)
参数1：是字符串数组，模块的依赖，会提前加载。一般都是空的。
参数2：依赖项加载完成之后的回调函数
所有的依赖加载完成之后，webpack会执行这个回调函数，require对象的一个实现会作为一个参数传递给回调函数，因此，可以require依赖和其他模块提供下一步的执行。
参数3：chunkName 是提供给这个特定的 require.ensure() 的 chunk 的名称。通过提供 require.ensure() 不同执行点相同的名称，我们可以保证所有的依赖都会一起放进相同的 文件束(bundle)。
const HelloJs =()=>require.ensure([],(require)=>require('@/components/HelloJs'),"HelloJs")
components:{
HelloJs
}
原理：webpack把这个模块导出一个js文件，然后用到这个模块的时候，就动态构造script标签插入DOM，再由浏览器去请求。回调函数是在依赖加载完成之后执行。
require.ensure可以使用参数给模块命名，然而import目前上不具备改功能，如果你需要保留该功能很重要，可以继续使用require.ensure。
