vue 异步引入组件

异步操作
	以一个工厂函数的方式定义返回你的组件,这个工厂函数会异步解析你的组件定义,Vue只有在这个组件需要被渲染的时候才会触发该工厂函数且会把结果缓存起来供未来重渲染.
	
	v2.x版本:
		方式一:
			Vue.component("组件名",(resolve)=>require(["../components/组件路径"],resolve))
			
		方式二:
		 	  components: {
			    'my-component': () => import('./my-async-component')
			  }
			  
			  也可以返回如下配置对象
			  () => ({
				  component: import('./MyComponent.vue'),	 需要加载的组件 (应该是一个 `Promise` 对象
				  loading: LoadingComponent,				 异步组件加载时使用的组件	
				  error: ErrorComponent,					 加载失败时使用的组件
				  delay: 200,								 展示加载时组件的延时时间。默认值是 200(毫秒)
				  timeout: 3000	如果提供了超时时间且组件加载也超时了,则使用加载失败时使用的组件。默认值是：`Infinity`
			  })

	v3.x版本:
		方式一:
			const AsyncComp = defineAsyncComponent(
			  () =>
			    new Promise((resolve, reject) => {
			      resolve({
			        template: '<div>I am async!</div>'
			      })
			      resolve(组件实例)
			    })
			)
			app.component('async-example', AsyncComp)

		方式二:
			const AsyncComp = defineAsyncComponent(() =>
			  import('./components/AsyncComponent.vue')
			)
			
			app.component('async-component', AsyncComp)