这是我参与「第五届青训营」伴学笔记创作活动的第10天
本堂课程，我们系统的了解到Webpack知识体系，由浅及深，从应用技巧到组件开发，再到Webpack构建流程的基本原理剖析，最后能够实现从0-1的搭建Webpack知识体系。
Webpack是一个流行的前端构建工具，它用于打包和优化JavaScript应用程序。Webpack将应用程序的所有模块作为一个依赖图形式进行管理，并生成一个或多个JavaScript包，这些包可以在浏览器中加载并执行。
开发环境：
安装Webpack 使用Webpack之前，需要先安装它。Webpack可以通过npm进行安装，使用命令：npm install webpack。如果要在项目中使用Webpack，则需要在项目中安装Webpack：npm install -D webpack。
创建项目：
在创建项目时，需要选择一个合适的模板。可以选择Webpack提供的模板，或者使用其他模板。要创建一个新项目，可以使用以下命令：webpack init。这会创建一个新的Webpack项目，其中包含了一些默认的配置文件和示例代码。
配置文件：
Webpack使用一个名为webpack.config.js的配置文件，该文件包含了一些配置项，用于指定项目的行为。在配置文件中可以指定诸如入口文件、输出文件、构建选项、插件等等。可以根据需要进行修改，以满足特定的需求。
插件：
Webpack使用插件来扩展其功能。插件可以用于添加新的功能，优化构建过程，或者修改已有的行为。Webpack提供了一些默认的插件，但是也可以自定义插件。
开发服务器：
Webpack的开发服务器可以提供实时重载功能。它可以监视代码的变化，并在代码发生变化时自动重新构建和刷新浏览器。使用命令webpack serve可以启动开发服务器。
构建：
（1）生产构建
当准备将应用程序部署到生产环境时，需要进行生产构建。生产构建将生成最小化的文件，并应用优化策略，以提高应用程序的性能。可以使用命令webpack --mode=production进行生产构建。
（2）优化
Webpack提供了一些优化策略，可以用于减小文件大小，提高性能。例如，Webpack使用Tree-shaking、代码分离、按需加载等策略，以减少不必要的代码和提高应用程序的加载速度。
（3）加载器
Webpack支持使用加载器处理各种类型的文件，例如CSS、Less、Sass等。使用加载器可以使得Webpack能够处理多种类型的文件，并将它们转换为适合在浏览器中运行的JavaScript。
（4）插件
Webpack的插件是其核心功能之一，可以用于自定义优化策略、处理各种类型的文件、提高构建速度等。Webpack提供了许多内置插件，也支持自定义插件。
