在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue.js項目懶加載(異步加載)還是有個別文件體積非常大,該怎么配置呢?

vue.js項目懶加載(異步加載)還是有個別文件體積非常大,該怎么配置呢?

我的項目結(jié)構(gòu)大致如下:
假設(shè)我有 40條路由,對應(yīng)40個組件,除了index、login兩條路由,其他全部被包含到另一個路由/admin/的子路由(或子路由的子路由)里面了。

我嘗試了一下,這個按需加載還是不太理想,沒有設(shè)置異步加載之前,打包后,app.xxx.js的體積 為3mb,當(dāng)我將Index路由對應(yīng)的組件分開打包時,app.xxx.js只有2.4mb了,然后多了一個'600kb'左右的'1-xxxxx.js',隨后我將所有的路由全部使用異步加載的方式來設(shè)置,發(fā)現(xiàn)多了很多js文件,但是app.xxxx.js的體積并沒有減小,反而增大了;

還有一個問題是,我index頁面的路由js文件雖然分開了,但是里面用到一個公共組件,所以在請求首頁的時候,請求中除了index對應(yīng)的js文件,還把另外一個 2.4mb 左右的文件給下載下來了,這可能是因為公共組件被打包到另外一個js文件的緣故吧?

那么,異步路由該怎么配置呢?或者配置的思路是什么呢?

假設(shè)我的項目結(jié)構(gòu)如下:

假設(shè)我有 40條路由,對應(yīng)40個組件,還有其他公共組件(10個左右,在一個文件夾里面);
除了index、login兩條路由,其他全部被包含到另一個路由/admin/的子路由(或子路由的子路由)里面了。

回答
編輯回答
九年囚

根據(jù)你的描述,app.xxx.js 的大小達(dá)到了3MB

即使項目規(guī)模非常的大,也不應(yīng)該出現(xiàn)這種情況。感覺你打包的時候,代碼拆分做的不好。
如果你打包使用的 webpack 可以參考這里 代碼分離

路由異步加載只是讓 app.xxx.js 體積縮小的其中一種方案,主要是代碼分離。

2018年8月6日 19:46