Vue CLI3 開(kāi)啟gzip壓縮文件的方式
gizp壓縮是一種http請(qǐng)求優(yōu)化方式，通過(guò)減少文件體積來(lái)提高加載速度。html、js、css文件甚至json數(shù)據(jù)都可以用它壓縮，可以減小60%以上的體積。
webpack在打包時(shí)可以借助 compression webpack plugin 實(shí)現(xiàn)gzip壓縮，首先需要安裝該插件：
npm i -D compression-webpack-plugin
在vue cli3.0 生成的項(xiàng)目里，可在 vue.config.js 中按照如下方式進(jìn)行配置：
壓縮前后大小大致如下：
生成的壓縮文件以.gz為后綴：
一般瀏覽器都已支持.gz的資源文件，在http請(qǐng)求的Request Headers 中能看到 Accept-Encoding:gzip
要使服務(wù)器返回.gz文件，還需要對(duì)服務(wù)器進(jìn)行配置，根據(jù)Request Headers的Accept-Encoding標(biāo)簽進(jìn)行鑒別，如果支持gzip就返回.gz文件。
總結(jié)
以上所述是小編給大家介紹的Vue CLI3 開(kāi)啟gzip壓縮文件的方式，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了vue利用插件實(shí)現(xiàn)按比例切割圖片，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
淺談在vue中用webpack打包之后運(yùn)行文件的問(wèn)題以及相關(guān)配置方法
下面小編就為大家分享一篇淺談在vue中用webpack打包之后運(yùn)行文件的問(wèn)題以及相關(guān)配置方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-02-02
Composition Api封裝業(yè)務(wù)hook思路示例分享
這篇文章主要為大家介紹了Composition Api封裝業(yè)務(wù)hook的思路示例分享，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
vue3+Element?Plus?v-model實(shí)現(xiàn)父子組件數(shù)據(jù)同步的案例代碼
這篇文章主要介紹了vue3+Element?Plus?v-model實(shí)現(xiàn)父子組件數(shù)據(jù)同步,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2024-01-01
Vue2過(guò)渡標(biāo)簽transition使用動(dòng)畫(huà)方式
這篇文章主要介紹了Vue2過(guò)渡標(biāo)簽transition使用動(dòng)畫(huà)方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-07-07
Vant實(shí)現(xiàn)上傳多個(gè)圖片或視頻,更改視頻預(yù)覽圖
這篇文章主要介紹了Vant實(shí)現(xiàn)上傳多個(gè)圖片或視頻,更改視頻預(yù)覽圖，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要給大家介紹了關(guān)于vue中v-model失效原因以及解決方案的相關(guān)資料,vue的v-model是一個(gè)雙向綁定的數(shù)據(jù)流,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-07-07
這篇文章主要介紹了用vue快速開(kāi)發(fā)app的腳手架工具，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-06-06
本篇文章主要介紹了Vue學(xué)習(xí)筆記之表單輸入綁定，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
Vue使用js-audio-recorder實(shí)現(xiàn)錄制,播放與下載音頻功能
這篇文章主要為大家詳細(xì)介紹了Vue如何使用js-audio-recorder實(shí)現(xiàn)錄制,播放與下載音頻功能,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以了解下2023-12-12