- 高端網(wǎng)站建設(shè) 公眾號(hào)開發(fā) 小程序制作 網(wǎng)站seo優(yōu)化 H5活動(dòng)營(yíng)銷 互聯(lián)網(wǎng)產(chǎn)品
([';], )}2、引入CDN細(xì)心的同學(xué)" />
1、路由懶加載
路由懶加載簡(jiǎn)單來(lái)說(shuō)就是訪問到當(dāng)前頁(yè)面才會(huì)加載相關(guān)資源,提高頁(yè)面加載速度。
{
path: '/login', name: 'login',
: => ([';], )
}
2、引入CDN
細(xì)心的同學(xué)會(huì)發(fā)現(xiàn),項(xiàng)目打包完成后dist文件中有個(gè) xxxx.js文件,此文件由引入的插件、庫(kù)生成vue提升首屏加載速度,引入的越多,文件就越大vue提升首屏加載速度,為此將體積較大的插件通過CDN引入,降低文件的大小。
假設(shè)vue項(xiàng)目引用以下組件
;;
;./App.;
from './'
axios from ';
iView from ';
';
(1)、在/build/.base.conf.js中,增加
. = {
: {
';: 'Vue',
';: ';,
';: ';
}
}
(2)、為解決dev環(huán)境下,重復(fù)引用庫(kù)的問題,復(fù)制/index.html為/index.dev.html,并修改/build/.dev.conf
: [
new ({
: 'index.;,
// : 'index.;,
: 'index.dev.;,
: true
})
]
(3)、在index.html中,引入cdn文件
(4)、提取css到外部,減少app.css體積
去除/src/main.js中引入的css文件,改為在開發(fā)環(huán)境下使用
;iview/dist//iview.css
if (.;') {
('mint-;)
}
在/index.hrml中引入CDN文件
3、使用組建按需加入
如對(duì)于-ui,需要那部分就使用哪部分。
4、將組件寫的css整合到一個(gè)文件里;
5、打包時(shí)可以不下載Map文件,因?yàn)镸ap文件占內(nèi)存也很大