摘要:所以我們就需要把某些路由用異步加載懶加載的方式進(jìn)行加載先來看正常的加載方式下面是第一種異步加載方法下面是第二種異步加載方法因為我們公司的項目整個就是用結(jié)合的方式搭建的。
vue本身不多介紹。直接說問題,因為vue的所有路由都是加載在一個app.js里的,如果項目巨大,那么首頁加載會是災(zāi)難。所以我們就需要把某些路由用異步加載(懶加載)的方式進(jìn)行加載.
1.先來看正常的加載方式import Login from "@/components/pages/signIn/signIn"; export default new Router({ routes: [ { path: "/login", component: Login, }] });2.下面是第一種異步加載方法
export default new Router({ routes: [ { path: "/login", component: resolve=>require(["@/components/pages/signIn/signIn"],resolve), }] });3.下面是第二種異步加載方法(因為我們公司的項目整個就是用vue結(jié)合webpack的方式搭建的。所以這個方法直接使用是沒問題的。如果只是部分的界面使用vue的,可能試一下才能確定能不能用,可能要考慮import能否支持(轉(zhuǎn)化)的問題,畢竟這是ES6新特性)
export default new Router({ routes: [ { path: "/login", component: ()=>import("@/components/pages/signIn/signIn"), }] });
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/97068.html
摘要:所以,那些使用較少的路由組件不必打包進(jìn)里,只需要在路由被訪問時按需加載。寫起來像這樣空數(shù)組用來指定該路由組件需要加載的依賴不過,你最好不要使用這種包裹起來的寫法,因為會使用靜態(tài)分析來檢測和分割塊。 作者:Joshua Bemenderfer 原文地址: lazy-loading-routes 譯者:jeneser 當(dāng)你的SPA(單頁應(yīng)用程序)變得復(fù)雜時,打包構(gòu)建后的Javascript...
摘要:懶加載也叫延遲加載,即在需要的時候進(jìn)行加載,隨用隨載。路由的懶加載按需加載的寫法效果按需加載會在頁面第一次請求的時候,把相關(guān)路由組件塊的添加上非按需加載則會把所有的路由組件塊的包打在一起。當(dāng)業(yè)務(wù)包很大的時候建議用路由的按需加載懶加載。 懶加載也叫延遲加載,即在需要的時候進(jìn)行加載,隨用隨載。在單頁應(yīng)用中,如果沒有應(yīng)用懶加載,運用webpack打包后的文件將會異常的大,造成進(jìn)入首頁時,需要...
摘要:當(dāng)一個的項目體積變得十分龐大的時候,使用的代碼分離功能將,或的代碼進(jìn)行分離并按需加載,會極大的提高的首屏加載速度。如果我們使用函數(shù)在中返回模塊作為載荷,就實現(xiàn)了懶加載。 當(dāng)一個Vue的項目體積變得十分龐大的時候,使用Webpack的代碼分離功能將Vue Components,routes或Vuex的代碼進(jìn)行分離并按需加載,會極大的提高App的首屏加載速度。 showImg(https:...
閱讀 1374·2019-08-30 15:55
閱讀 1655·2019-08-26 10:21
閱讀 3447·2019-08-23 18:28
閱讀 3383·2019-08-23 15:38
閱讀 753·2019-08-23 15:24
閱讀 2143·2019-08-23 13:59
閱讀 785·2019-08-23 11:31
閱讀 2875·2019-08-23 10:53