webpack文档链接：webpack.docschina.org/loaders/bun…

一、webpack思维导图

二、概念（笔记内容）

webpack是JS的静态模块打包工具，当wp处理应用程序时，它会从内部一个或多个入口点构建一个依赖图，然后将项目中所需的每个模块组合成一个或多个bundles。

1. 入口

1）入口起点（entry point）：指示webpack应该使用哪个模块为构建其内部依赖图的开始。默认值是./src/index.js}，可通过webpack configuration中配置entry属性}。

2. 输出

$\color{red}{output属性}$告诉webpack在哪里输出它所创建的bundle，以及如何命名这些文件。主要输出文件的默认值./dist/main.js，其他生成文件默认放置在./dist文件夹。

3. loader

1）webpack只能理解JS和JSON文件，loader让webpack能够处理其他类型的文件，并将它们转换为有效的模块，以及被添加到依赖图

• loader两个属性：
  • test属性：识别哪些文件会被转换
  • use属性：转换时使用哪个loader

由于markdown记笔记的速度太慢，使用pdf或纸质版阅读。如需了解详细用法，请自行查看官方文档