vue组件的按需加载

vue

一、require.ensure()

require.ensuire(dependencies:String[],callback:function(require),errorCallback:function(error),chunkName:String)

const List = resolve =>{ require.ensuire([],()=>{ resolve(require(\'./list\')) },\'list\') }

webpack在打包的时候会把整个路由打包成一个js文件,路由组件越多,js文件越大,加载越缓慢。使用require.ensure()加载的组件会单独打出一个js文件。以下就是每个组件,没有自定义名称,会被从0开始命名(有hash的时候会被带上md5)。

二、在router中配置,使用以下方法也可以实现按需加载,一个组件生成一个js文件。

{

path: \'/home\',

name: \'home\',

component:resove => require([\'@/components/home\'],resolve)

}

三、使用import()加载组件

const test1 = ()=>import(\'@/components/test1.vue\') 

以上是 vue组件的按需加载 的全部内容, 来源链接: utcz.com/z/380912.html

回到顶部