Webpack 的五大类主要包括：
入口（Entry）：Webpack 打包的起点，它指示 Webpack 应该从哪个文件开始构建依赖图。一个应用程序可以有一个或多个入口。
输出（Output）：Webpack 打包后的文件输出配置，它指示 Webpack 应该将打包后的文件输出到哪个目录。通常情况下，Webpack 会将打包后的文件输出到一个或多个 JavaScript 文件中。
加载器（Loader）：Webpack 通过加载器来处理各种类型的文件，例如 CSS、图片、字体等。加载器可以将这些文件转换为 JavaScript 模块，以便在应用程序中使用。
插件（Plugin）：Webpack 插件是一个扩展，它可以执行各种任务，例如优化打包结果、压缩代码、提取公共代码等。插件可以在整个构建过程中执行操作，并可以访问 Webpack 的编译器和依赖图。
模式（Mode）：Webpack 提供了不同的模式，例如开发模式和生产模式。模式可以影响 Webpack 的行为，例如启用某些插件或优化选项，以便在不同的环境下获得最佳的性能和输出质量。
loader和plugin的区别
Loader
Loader 用于对模块的源代码进行转换。Webpack 在打包模块时，会根据指定的 Loader 对源代码进行转换，
Plugin
Plugin 用于扩展 Webpack 的功能。Plugin 可以在 Webpack 打包的不同阶段执行额外的任务，
webpack的优化
第一个：让首屏加载更快，把首屏的入口文件变小，还可以把有些包在进行一个时进行一个忽略，后面在是通过一个CDN的方式进行引入，让打包进行
第二个：通过代码分割让每个包变小，可以用webpack中配置的optimization这个选项来分割，让每一个区块都变小，
第三个：对于图片来说，把小的图片进行一个base64的压缩，而对于大的图片呢，就是使用一个CDN，在结合懒加载或预加载。
第四个：使用滚动加载，一就是通过监听滚动条来，判断是否进行加载，二是用IntersectionObserver在进行一个实现。
