📌 项目地址：webpack/webpack | ⭐ 65,904 颗星 | 🔧 JavaScript | 📜 未标注
它到底做什么
webpack 的官方定义是“module bundler”（模块打包器）。核心目标是把 JavaScript 文件打包成浏览器能用的形式，但它也能转换、打包几乎任何资源。README 里明确写了：它能处理 ES Modules、CommonJS、AMD，甚至允许三种规范混用在同一个项目里。
依赖解析发生在编译阶段，而不是运行时。这意味着打包结果里只包含真正用到的代码，运行时不需要额外的模块加载器，体积更小。
三个关键能力
异步加载。webpack 可以生成单个 bundle，也可以拆成多个 chunk。这些 chunk 在运行时按需异步加载，首屏只加载必要部分。这是大型应用优化加载时间的基础手段。
Loader 预处理。编译时对源文件做转换，比如 TypeScript 转成 JavaScript、Handlebars 模板字符串编译成函数、图片转成 Base64。Loader 是 webpack 能处理非 JS 资源的原因。
插件系统。高度模块化，允许扩展自定义行为。打包之外的任何需求，比如压缩、注入环境变量、生成 HTML，都可以通过插件实现。
安装方式
README 给了两种包管理器安装命令：
npm install --save-dev webpack
yarn add webpack --dev
注意都是 --save-dev，因为 webpack 是构建工具，运行时不需要。
浏览器兼容性
README 的“Browser Compatibility”章节没写完整，只写了“webpack supports al”，后面被截断了。可以去官方文档查具体版本支持范围。但可以确定的一点是，webpack 打包出的产物需要考虑目标浏览器对 ES 语法的支持，这个问题通常交给 babel-loader 处理。
从哪里开始学
README 指向了官方 Get Started 指南：https://webpack.js.org/guides/getting-started，以及更多其他指南。自己也推荐两个视频：
- Understanding Webpack – Video 1：https://www.youtube.com/watch?v=xj93pvQIsRo
- Understanding Webpack – Video 2：https://www.youtube.com/watch?v=4tQiJaFzuJ8
我的看法
webpack 的学习曲线确实陡。核心原因是它把“配置”当作主要交互方式，而配置项的组合方式几乎是无限的。但它的灵活性也来自这里。如果你只需要打包几个 JS 文件，其他工具可能更省事；如果项目涉及复杂代码拆分、多样化资源处理、深度定制构建流程，webpack 依然是事实标准。
README 提到的贡献、赞助、成员信息我就不展开了，那些是项目治理层面的内容。关键是理解它的定位：一个在编译期解决依赖、在打包期处理资源、在运行时支持异步加载的构建基础设施。