• @babel/preset-env 基本的兼容性处理
• core-js 按需兼容

• terser-webpack-plugin 因为 uglifyjs-webpack-plugin 不支持 es6

• eslint、eslint-loader

• babel 缓存
• 文件资源缓存：加 hash 值 或 加 chunkhash 或 加 contenthash

• .browserslistrc

1. 在 package.json 中配置，"sideEffects": false 所有代码都没有副作用(都可以被 tree shaking)
2. 问题：可能会把 css / @babel/polyfill (副作用)文件干掉，要写成"sideEffects": ["*.css"]

前提：1.必须使用 ES6 模块化 2.开启 production 环境 作用：减少代码体积

• 业务代码和第三方库分离打包，实现代码分割
• 业务代码中的公共业务模块提取打包到一个模块
• 第三方库最好也不要全部打包到一个文件中，因为第三方库加起来通常会很大，把一些特别大的库单独打包，剩下的加起来如果还是特别大，就按照一定大小分割成若干模块

• 某些包过大 不通过打包方式引入

1. dev 环境

• 优化打包构建速度
• 优化代码调试

2. prod 环境

• 优化打包构建速度
• 优化代码运行的性能