Webpack配置

• app.js： 业务代码
• runtime.js：webpack的引导代码
• vendor.js: npm引入的js包代码

optimization 配置项

optimization 配置选项用于优化打包结果。用来自定义一些优化打包策略

• minimizer：配置使用的压缩工具。常用的压缩工具有 UglifyJS、TerserJS 和 CSSMinimizerPlugin 等。

optimization: {
  minimizer: [
    new TerserJSPlugin(),
    new OptimizeCSSAssetsPlugin()
  ]
}

Webpack 基本概念

webpack (Web Package) 是一种前端构建工具。

webpack 是一个现代JS应用程序的静态模块打包工具(module bundler)。webpack专注构建模块化项目，分析项目结构，在内部构建依赖图，依赖图包含项目所需的每个模块，根据模块的依赖关系进行静态分析，将浏览器不能直接运行的拓展语言编译转换为合适的格式以供浏览器运行，例如：less/sass -> css，ES6/7/8 -> ES5等，最终打包输出一个或多个静态资源 （bundle）。