Webpack疑问：未配置压缩选项，bundle.js为何默认被压缩？如何关闭？

嘿，这个问题我碰到过好多次啦！大概率是Webpack的模式（mode）设置在搞鬼，尤其是Webpack 4及以上的版本，默认会根据运行模式自动启用优化，包括代码压缩。我帮你一步步分析解决：

最常见的原因：生产模式（production）自动启用压缩 #

从Webpack 4开始，官方引入了mode配置项，当你在启动命令里指定--mode production，或者在config文件里设置mode: 'production'时，Webpack会自动帮你开启以下优化：

• 启用TerserPlugin进行代码压缩、丑化
• 开启Tree Shaking
• 移除无用代码

哪怕你没在webpack.config.js里手动配置任何压缩插件，这些优化都会自动生效。

解决办法 #

方法1：切换到开发模式（development） #

这是最简单的方式，开发模式下Webpack会保留代码格式、注释，方便你调试。

• 检查你的package.json里的启动脚本，比如如果是这样：

"scripts": {
  "build": "webpack --mode production"
}

把production改成development即可：

"scripts": {
  "build": "webpack --mode development"
}

• 或者直接在webpack.config.js里显式指定模式：

const path = require('path');
module.exports = {
  mode: 'development', // 强制使用开发模式，关闭默认压缩
  entry: './src/app.js',
  output: {
    path: path.join(__dirname, 'public'),
    filename: 'bundle.js'
  },
  module: {
    rules: [{ 
      loader: 'babel-loader', 
      test: /\.js$/, 
      // 你的其他loader配置...
    }]
  }
}

方法2：在生产模式下手动禁用压缩（不推荐） #

如果你确实需要在生产模式下保留未压缩的代码，可以通过optimization配置关闭默认压缩：

const path = require('path');
module.exports = {
  mode: 'production',
  entry: './src/app.js',
  output: {
    path: path.join(__dirname, 'public'),
    filename: 'bundle.js'
  },
  optimization: {
    minimize: false // 关闭默认的代码压缩
  },
  // 其他配置...
}

不过一般不建议这么做，生产环境还是压缩代码更利于性能。

额外检查点 #

如果上面的方法都没用，你可以检查下：

• 有没有安装并引入了第三方压缩插件（比如uglifyjs-webpack-plugin）
• Babel配置里有没有开启压缩相关的插件（比如babel-plugin-minify）

但90%的概率都是mode设置的问题，先从这个方向排查准没错！

内容的提问来源于stack exchange，提问作者PowPowPow