vue项目关闭console与console的类型

这是我参与11月更文挑战的第7天，活动详情查看：2021最后一次更文挑战

vue打包的时候，全局注释console调试

在开发的时候，我们会用到很多console的调试，在开发完成的时候，又不想一个个去注释，所以在打包的时候可以在build文件夹中找到webpack.prod.conf.js文件中添加以下代码

 new UglifyJsPlugin({
      uglifyOptions: {
        compress: {
          warnings: false,
          //过滤console.log-start
          drop_console: true,
          pure_funcs: ['console.log']
          //过滤console.log-end
        }
      },
      sourceMap: config.build.productionSourceMap,
      parallel: true
    }),

console的类型

console.table

这是一个可以把数组结构的数据打印出表格在控制台展示

let arr = [
              {
                  id: "46f7c6ba-b4ca-4843-b5d1-76399d1ac52a",
                  parentId: "a80ff169-d6f6-4752-b980-fd818240410f",
                  attributeName1: "颜色",
              },
              {
                id: "46f7c6ba-b4ca-4843-b5d1-76399d1ac52a",
                  parentId: "a80ff169-d6f6-4752-b980-fd818240410f",
                  attributeName1: "颜色",
              },
              {
                id: "46f7c6ba-b4ca-4843-b5d1-76399d1ac52a",
                  parentId: "a80ff169-d6f6-4752-b980-fd818240410f",
                  attributeName1: "颜色",
              }
          ]
console.table(arr);

结果如下

console.error()

这个方法，可以在控制到看到有个错误提示的标识

console.error('错误信息')

console.log()

这是最常用的一个打印数据的用法，可以用来打印各种各样的信息，返回的数据呀，纯数据呀还有函数的判断也可以直接进行打印出结果的

let num = 0
let num2 = 1
console.log(num>num2)
console.log(num===num2)
console.log(num<num2)

console.time() 与 console.timeEnd()

这是一个计时的打印方法，time()是计时开始，timeEnd()是计时结束，看下面的操作和结果

console.time('计时器1');
          for (var i = 0; i < 10; i++) {
            for (var j = 0; j < 10; j++) {}
          }
          console.timeEnd('计时器1');

console.warn()

这个是一个警告的打印信息方法，和错误的类型差不多的，只是颜色的提示不一样

console.count()

这是打印计数的一个方法

(function() {
  for (var i = 0; i < 10; i++) { 
    console.count('count'); 
  }
})();