RektRookie 2022-02-15 11:28 采纳率: 0%
浏览 406
已结题

webpack打包使用 terser-webpack-plugin删除console.log不生效

问题遇到的现象和发生背景

使用terser-webpack-plugin打包生产环境代码时,没有清除console.log

问题相关代码,请勿粘贴截图

const version = "1.0.0";
const timestamp = new Date().getTime();
const env = process.env;
const isProduction = env.NODE_ENV === 'production';
const isTest = env.NODE_ENV === 'test';
const isDevelopment = env.NODE_ENV === 'development';
const TerserPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const pack = require('./package.json');
const moment = require('moment');
env.VUE_APP_BUILD_TIME = moment().format('YYYY-M-D HH:mm:ss');
env.VUE_APP_VERSION = version;
env.VUE_APP_VERSION_SUFFIX = timestamp;
env.VUE_APP_NAME = pack.name;
env.VUE_APP_BUILD_USER = 'TEST';

module.exports = {
  //路径前缀
  publicPath: "/",
  lintOnSave: true,
  productionSourceMap: false,
  outputDir: env.outputDir,
  configureWebpack: config => {
    if (isProduction) {
      config.plugins.push(
        new TerserPlugin({
          terserOptions: {
            ecma: undefined,
            warnings: false,
            parse: {},
            compress: {
              drop_console: true,
              drop_debugger: true,
              pure_funcs: ['console.log','window.console.log']
            }
          }
        })
      );
      config.plugins.push(
        new MiniCssExtractPlugin({
          // 类似 webpackOptions.output里面的配置 可以忽略
          filename: `css/[name].${version}.${timestamp}.css`,
          chunkFilename: `css/[name].${version}.${timestamp}.css`
        }),
      );
    }
  },

  chainWebpack: (config) => {
    //忽略的打包文件
    config.externals({
      'vue': 'Vue',
      'vue-router': 'VueRouter',
      'vuex': 'Vuex',
      'axios': 'axios',
      'element-ui': 'ELEMENT',
    });
    const entry = config.entry('app');
    entry.add('babel-polyfill').end();
    entry.add('classlist-polyfill').end();
    entry.add('@/mock').end();

    if (!isDevelopment){
      config.output.filename(`js/[name].${version}.${timestamp}.js`).end();
      config.output.chunkFilename(`js/[name].${version}.${timestamp}.js`).end();
    }
  },
  css: {
    extract: { ignoreOrder: true }
  },
  //开发模式反向代理配置,生产模式请使用Nginx部署并配置反向代理
  devServer: {
    port: 8081,
    proxy: {
      '/api': {
        //本地服务接口地址
        target: 'http://localhost:8080',
        ws: true,
        pathRewrite: {
          '^/api': '/'
        }
      }
    }
  }
};


运行结果及报错内容

生产环境F12控制台依然打印conso.log内容

我的解答思路和尝试过的方法

CSDN,百度各方面搜索尝试都没有与解决

我想要达到的结果

生产环境打包能够自动清除console.log

  • 写回答

0条回答 默认 最新

    报告相同问题?

    问题事件

    • 系统已结题 2月23日
    • 创建了问题 2月15日

    悬赏问题

    • ¥15 有两个非常“自以为是”烦人的问题急期待大家解决!
    • ¥30 STM32 INMP441无法读取数据
    • ¥100 求汇川机器人IRCB300控制器和示教器同版本升级固件文件升级包
    • ¥15 用visualstudio2022创建vue项目后无法启动
    • ¥15 x趋于0时tanx-sinx极限可以拆开算吗
    • ¥500 把面具戴到人脸上,请大家贡献智慧,别用大模型回答,大模型的答案没啥用
    • ¥15 任意一个散点图自己下载其js脚本文件并做成独立的案例页面,不要作在线的,要离线状态。
    • ¥15 各位 帮我看看如何写代码,打出来的图形要和如下图呈现的一样,急
    • ¥30 c#打开word开启修订并实时显示批注
    • ¥15 如何解决ldsc的这条报错/index error