Vue移除Console.log()

移除Console.log()

一. 安装对应依赖

两种方法:分别针对于终端和可视化窗口,

第一种方式为:打开终端-输入npm i babel-plugin-transform-remove-console  --save  --dev

第二种方法为:打开可视化窗口-依赖面板-安装依赖-选择开发依赖-搜索babel-plugin-transform-remove-console插件

二. 原理分析

在babel文件添加transform-remove-console字段,取除console.log输出,通过添加if函数

以实现发布项目阶段的作用生效

三. 操作原理

(1) 首先进入项目打开babel.config.js,将 transform-remove-console粘贴到plugins数组当中


(2) [endif]但这种移除方法会将项目开发阶段和发布阶段的打印输出方式全部移除,显然这是不合理的,所以应当将其修改为发布阶段的移除模式,首先需要在babel.config.js当中定义一个空数组prodPlugins用于接收transform-remove-console字段,接下来,判断process.env.NODE_ENV的值,如果值为production证明项目属于发布阶段,那么将transform-remove-console字段加入到prodPlugins当中,并将prodPlugins数组以…prodPlugins的形式保存到plugins数组当中,同时删除之前加入的transform-remove-console

你可能感兴趣的:(Vue移除Console.log())