完美解決vue 項(xiàng)目開發(fā)越久 node_modules包越大的問題
解決 vue 項(xiàng)目開發(fā)越久 node_modules包越大的問題
vue 每次編譯都會將編譯后的文件緩存在 node_modules /.cache 里面，因此需要在 vue.config.js 配置取消緩存
compression-webpack-plugin 禁止緩存
const CompressionPlugin = require("compression-webpack-plugin");
module.exports = {
plugins: [
new CompressionPlugin({
cache: false, // 取消緩存
algorithm: "gzip",
filename: "[path].gz[query]",
test: /\.(js|css|woff|woff2|json|txt|html|ico|svg)(\?.*)?$/i, // 要壓縮的文件
threshold: 10240, // 壓縮超過10k的數(shù)據(jù)
deleteOriginalAssets: false, // 不刪除壓縮前的文件，如果瀏覽器不支持Gzip，則會加載源文件
minRatio: 0.8, // 壓縮比大于0.8的文件將不會被壓縮
}),
],
}vue項(xiàng)目中node_modules內(nèi)容修改并且永久生效（Popup彈出層組件）
在做vue項(xiàng)目的時(shí)候用了vantUI中Popup彈出層組件，由于項(xiàng)目的需要，要求表頭的層級比彈出層的層級大，然后就會設(shè)置z-index，但是Popup組件每點(diǎn)擊一次他的z-index值就會增大這是此組件的一個(gè)屬性，可以把表頭的z-index設(shè)置成特別大，但是覺得這對于一個(gè)會疊加z-index的組件來說始終不是解決辦法，然后就找到了vant中設(shè)置Popup的代碼修改了一下。
這是我項(xiàng)目中此文件的路徑node_modules/vant/es/mixins/popup/index.js。但是修改了以后當(dāng)時(shí)沒問題，當(dāng)重新 npm install的時(shí)候還是會回到初始化的時(shí)候，此時(shí)就需要借助patch-package來打一個(gè)補(bǔ)丁。
使用npm安裝 npm i patch-package
使用yarn安裝 yarn add patch-package postinstall-postinstall
安裝完成需要在packge.json中設(shè)置 "postinstall": "patch-package"
然后再去修改node_modules中的內(nèi)容，手動執(zhí)行npx patch-package加修改的文件名，執(zhí)行完成后會在項(xiàng)目中生成一個(gè)補(bǔ)丁文件來記錄你所修改的內(nèi)容。
到此這篇關(guān)于解決 vue 項(xiàng)目開發(fā)越久 node_modules包越大的問題的文章就介紹到這了,更多相關(guān)vue node_modules包越大內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Vue中圖片上傳組件封裝-antd的a-upload二次封裝的實(shí)例
這篇文章主要介紹了Vue中圖片上傳組件封裝-antd的a-upload二次封裝的實(shí)例，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
本篇文章主要介紹了vuex2.0 之 modules,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-11-11
這篇文章主要介紹了vue中引入第三方字體文件的方法示例，文中講述了實(shí)現(xiàn)方法及其錯誤的解決，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-12-12
vue3 高德地圖關(guān)鍵詞搜索獲取經(jīng)緯度的示例代碼
這篇文章主要介紹了vue3 高德地圖關(guān)鍵詞搜索獲取經(jīng)緯度的示例代碼,需要的朋友可以參考下2024-08-08
vue實(shí)現(xiàn)一個(gè)單文件組件的完整過程記錄
整個(gè)項(xiàng)目結(jié)構(gòu)清晰,尤其單文件組件的表現(xiàn)力尤為突出,使得每個(gè)組件的邏輯都沒有過于復(fù)雜,所以這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)一個(gè)單文件組件的相關(guān)資料,需要的朋友可以參考下2021-06-06
這篇文章主要介紹了vue 虛擬DOM的相關(guān)資料，幫助大家更好的理解和學(xué)習(xí)使用vue框架，感興趣的朋友可以了解下2021-04-04
在一些網(wǎng)站經(jīng)常可以看到切換語言包,將網(wǎng)站轉(zhuǎn)化成多種語言版本的情況,下面這篇文章主要給大家介紹了關(guān)于vue中i18n的安裝與幾種使用方式的相關(guān)資料,需要的朋友可以參考下2022-09-09
ElementUI級聯(lián)選擇器實(shí)現(xiàn)同一父級下最多只能選中一個(gè)子級
本文主要介紹了ElementUI級聯(lián)選擇器實(shí)現(xiàn)同一父級下最多只能選中一個(gè)子級,同一父級下的子節(jié)點(diǎn)單選,又可以選擇多個(gè)不同父級下的節(jié)點(diǎn),具有一定參考價(jià)值,感興趣的可以了解一下2023-10-10
詳解vue2.0 transition 多個(gè)元素嵌套使用過渡
這篇文章主要介紹了詳解vue2.0 transition 多個(gè)元素嵌套使用過渡，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
這篇文章主要為大家詳細(xì)介紹了vue利用插件實(shí)現(xiàn)按比例切割圖片，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09