1、 通常在我們使用 vue-cli 構建專案時，在預設情況下 執行npm run build 後會將專案中所有的 js **打包為乙個整體。而且這個包體積會非常的大。導致我們在進入首頁時會載入的非常慢。即使初始化有 loading 效果，也不利於使用者體驗。
所以這是就體現出懶載入(延遲載入)的重要性。所謂懶載入就是 把不同路由對應的不同元件分割成不同的**塊。
這樣可實現將頁面進行劃分，需要的時候再去載入，從而到達減少初始頁面的載入壓力。
2、 懶載入方法(兩種方法)
(1）es6提出的import（推薦）
舉例：
import vue from 'vue'
import router from 'vue-router'
vue.use(router)
const hello = ()=>import("@/components/hello")
export default new router(]})
寫法： component:resolve =>require(["需要載入的模組"],resolve)
第乙個引數：需要載入的模組 ，第二個引數：載入成功的引數
Vue Router（路由懶載入）
常用的路由懶載入方式 1 vue非同步元件 非同步載入 2 路由懶載入 使用import vue非同步元件 非同步載入 vue router配置路由 使用vue的非同步元件技術 可以實現按需載入 但是，這種情況下，webpack打包時乙個元件生成乙個js檔案，即每載入乙個元件都需要載入乙個新的js檔...
vue router路由懶載入
方式一 結合vue的非同步元件和webpack的 分析 const home resolve 方式二 amd寫法 const about resolve require components about.vue resolve 方式三 在es6中，我們可以有更加簡單的寫法來組織vue非同步元件和we...
vue router 路由懶載入
懶載入模式 大專案中，為了提高初始化頁面的效率，路由一般使用懶載入模式，一共三種實現方式。1 第一種寫法 component resolve require components one resolve 2 第二種寫法 component import components two 這樣 const...