zoukankan      html  css  js  c++  java
  • vue+webpack实现懒加载的三种方式

    实现方式:

    1、webpack method

      require.ensure([''], callback, chunkName) ;

    2、es6 motehod

      import()

      import().then()

      import(/* webpackChunkName: async-chunk-name */ /* webpackMode: lazy */ modulename)

      需要安装bable插件 syntax-dynamic-import,因为import只能出现在页面顶部

    具体实现:

    第一种、

      

    var component = (resolve) => {
        import(/* webpackChunkName:'vendor'*/'组件路径').then(module => {
           resolve(module)
        })      
    }

    第二种、

    var component = (resolve) => {
        require(['组件路径'], resolve)  
    }

    第三种、

    var component = (resolve) => {
      require.ensure([], () =>{
           resolve(reauire('组件路径'));
        }, chunkName)
    }
  • 相关阅读:
    Java程序员从笨鸟到菜鸟全部博客目录
    Problem I
    Problem I
    Problem S
    Problem S
    Problem X
    Problem X
    Problem Q
    Problem Q
    Ellipse
  • 原文地址:https://www.cnblogs.com/fqlGlog/p/11695157.html
Copyright © 2011-2022 走看看