vue項(xiàng)目打包清除console.log的四種方法總結(jié)
記錄一下項(xiàng)目中碰到的小問(wèn)題，打包清除console.log的方法，vue2，vue-cli5.0.0（得注意一下自己項(xiàng)目的vue-cli版本）
第1種：
uglifyjs-webpack-plugin插件，配置在vue.config.js中，不支持es6，已歸檔，不再維護(hù)，不推薦，vue-cli3,4可行，vue-cli5中未生效。（我項(xiàng)目中未生效，不附代碼，可自行搜索嘗試）
第2種：
terser-webpack-plugin插件，配置在vue.config.js中，vue-cli5自帶，vue-cli3,4需要下載插件，vue-cli3,4可行，vue-cli5中已無(wú)默認(rèn)對(duì)應(yīng)配置屬性’drop_console’，自己添加后依舊未生效。（我項(xiàng)目中未生效，不附代碼，可自行搜索嘗試）
第3種：
babel-plugin-transform-remove-console插件，配置在babel.config.js中，vue-cli5實(shí)測(cè)可行，vue-cli3,4也可行。（嘗試后，谷歌瀏覽器控制臺(tái)僅websocket的打印輸出未清除，其他打印輸出都是清除干凈了的）
下載依賴
npm install babel-plugin-transform-remove-console -D or yarn add babel-plugin-transform-remove-console -D
babel.config.js中
const proPlugins = [];
// 判斷環(huán)境
if (process.env.NODE_ENV === 'production') {
proPlugins.push('transform-remove-console');
}
module.exports = {
plugins: [...proPlugins],
};
第4種：
不用插件，main.js中判斷生產(chǎn)環(huán)境后window.console.log = function (){};即可，vue-cli5實(shí)測(cè)可行，vue-cli3,4也可行。（嘗試出來(lái)的效果是清除得最干凈的，但不清楚這種侵入式覆蓋的寫(xiě)法有啥弊端沒(méi)有）
main.js中
// 正式環(huán)境清除所有console.log
if (process.env.NODE_ENV === 'production') {
if (window) {
window.console.log = function () {};
}
}
總結(jié)
到此這篇關(guān)于vue項(xiàng)目打包清除console.log的四種方法總結(jié)的文章就介紹到這了,更多相關(guān)vue打包清除console.log內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家介紹了vue3中element的Form表單用法實(shí)例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-10-10
在網(wǎng)上找了好久關(guān)于左右過(guò)渡動(dòng)畫(huà)折疊的組件,沒(méi)有合適的代碼,效果類(lèi)似于element UI中的Drawer抽屜組件,只不過(guò)ele中的都是懸浮的組件,工作中遇到的很多都是占用空間的展開(kāi)折疊,網(wǎng)上很多也是上下展開(kāi)收起的組件,于是就自己寫(xiě)了一個(gè),分享給大家,感興趣的朋友參考下吧2023-11-11
這篇文章主要介紹了使用 vue-i18n 切換中英文效果，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-05-05
解決Vue keep-alive 調(diào)用 $destory() 頁(yè)面不再被緩存的情況
這篇文章主要介紹了解決Vue keep-alive 調(diào)用 $destory() 頁(yè)面不再被緩存的情況，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-10-10
這篇文章主要介紹了vue如何實(shí)現(xiàn)文件上傳及預(yù)覽問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
本篇文章主要介紹了自定義vue組件發(fā)布到npm的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-05-05
全局安裝 Vue cli3 和 繼續(xù)使用 Vue-cli2.x操作
這篇文章主要介紹了全局安裝 Vue cli3 和 繼續(xù)使用 Vue-cli2.x操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-09-09
下面小編就為大家?guī)?lái)一篇vue.js實(shí)現(xiàn)備忘錄功能的方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
Vue快速實(shí)現(xiàn)通用表單驗(yàn)證功能
這篇文章主要介紹了Vue快速實(shí)現(xiàn)通用表單驗(yàn)證功能，本文通過(guò)一個(gè)小例子給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-12-12
Vue2.0基于vue-cli+webpack Vuex的用法(實(shí)例講解)
下面小編就為大家?guī)?lái)一篇Vue2.0基于vue-cli+webpack Vuex的用法(實(shí)例講解)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09