Perbincangan ringkas mengenai pengoptimuman pembungkusan vue-cli2.0

Question

Apabila mengubah suai assetsPublicPath dalam build in config/index.js,

jumpa productionSourceMap dan productionGzip di bawahnya.

Secara janggalnya, saya benar-benar tidak perasan kedua-dua sifat ini sekarang setelah saya menemuinya, mari kita terokainya.

Dengan idea pengaturcaraan untuk Google dan Baidu, saya pergi untuk menyemak dokumentasi, dan kemudian meringkaskannya secara ringkas untuk memudahkan diri saya mengisi lubang.

productionSourceMap

Sama ada untuk mendayakan penjanaan automatik fail .map semasa pembungkusan, adalah disyorkan untuk menukarnya kepada palsu, supaya saiz yang dibungkus dapat dikurangkan dengan banyak.

Satu lagi perkara penting ialah apabila ia benar, kod sumber anda terdedah

Hanya buka konsol penyemak imbas dan anda boleh melihat kod sumber anda terus dalam Sumber.性 Oleh itu, secara amnya disyorkan untuk menetapkan atribut ini kepada false

productionGzip

sama ada untuk membuka mampatan apabila pembungkusan dihidupkan Ini bergantung pada situasi saya. Saya sentiasa benar sejak saya menemui atribut ini.

Apabila menggunakan atribut ini, anda perlu memasang kebergantungan compression-webpack-plugin

Selepas versi 2.0.0, modul ini memerlukan sekurang-kurangnya Node v6.9.0 dan Webpack v4.0.0 ah

Jadi jika ia adalah webpack3.x versi, dengan Pasang mengikut nombor versi

Selepas membetulkan kedua-dua sifat, jalankan npm run build sekali lagi dan mendapati saiz pakej telah dikurangkan sebanyak kira-kira 50%, yang sangat mengejutkan