在前端构建编译代码时，压缩代码也非常重要。压缩代码量减小，传输速度快速，从而提高了网页的速度并降低了网络传输流量。此外，它还具有混淆源代码的效果。由于压缩代码读取的读数也很差，即使其他人下载了网页的代码，它也大大增加了代码分析和转换的难度。
目前，最成熟的JavaScript代码压缩工具是，它将分析JavaScript代码语法树以了解代码的含义，以实现优化，例如删除无效的代码，删除日志输出代码和缩短可变名称。
在WebPack V4中，默认情况下它在生产模式中集成。因此，默认包装的JS文件被压缩。如果您需要更多的海关，则可以进行配置。
首先，安装：
然后，将其添加到您的WebPack配置中：
可配置的项目：
CSS代码也可以像JS一样被压缩。目前，更成熟和可靠的CSS压缩工具是了解CSS代码的含义，而不仅仅是删除空间，例如：
对于WebPack V5或更高版本，使用官方建议。插件使用优化和压缩CSS支持在缓存和并发模式下运行。
首先，我们需要安装：
然后将插头-in添加到WebPack配置：
除了帮助我们简化HTML文件的创建外，还可以压缩HTML文件。
首先，您需要安装插件-in：
添加到WebPack配置文件：
如果未添加配置，将生成默认索引。HTML文件，所有块和压缩将自动注入到。
您还可以配置配置参数。以下是常见参数：
如果是，生成的HTML将使用HTML-Minifier-Terser和以下选项来压缩：