vue的异步组件按需加载

Posted chenlw

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue的异步组件按需加载相关的知识,希望对你有一定的参考价值。

当build打包后,app.js过大的时候,可以考虑用异步组件的方式。

import HomeHeader from "./components/Header";
import HomeSwiper from "./components/Swiper";
import HomeIcons from "./components/Icons";
import HomeRecommend from "./components/Recommend";
import HomeWeekend from "./components/Weekend";

export default {  
    name: "Home", 
    components: {   
        HomeHeader,     
        HomeSwiper,    
        HomeIcons,   
        HomeRecommend,   
        HomeWeekend  
    } 
}

            

  以下是异步组件加载方式:

export default {
  name: ‘Home‘,

  components: { 
    //异步组件加载方式    
    HomeHeader: () => import("./components/Header"),  
    HomeSwiper: () => import("./components/Swiper"),
    HomeIcons: () => import("./components/Icons"),
    HomeRecommend: () => import("./components/Recommend"),   
    HomeWeekend: () => import("./components/Weekend")  
  }
}

  

以上是关于vue的异步组件按需加载的主要内容,如果未能解决你的问题,请参考以下文章