Webpack

Webpack

将脚本、模块与静态资源统一打包Webpack 根据模块之间的依赖关系处理项目资源,可打包 JavaScript,并转换或封装 CSS、图片、Sass 等资源。开发者既可直接通过命令行生成 bundle.js,也可使用 webpack.config.js 设置入口、输出、解析、优化、插件、缓存和开发服务器等选项。

Webpack 页面快照
3 种
页面提供英语、中文和韩语入口
2 个
安装命令包含 webpack 与 webpack-cli
1 个
示例构建输出文件 bundle.js
核心能力

围绕依赖关系构建和输出项目资源

从模块依赖分析到资源转换、构建配置和开发体验,提供完整的前端工程打包能力。

模块依赖打包

分析 JavaScript 模块及其依赖关系,将代码组织并输出为可在浏览器中使用的构建文件。

静态资源处理

除 JavaScript 外,还可转换、组合或封装 CSS、PNG、JPG、Sass、Handlebars 等资源。

构建配置

通过 webpack.config.js 设置入口、输出、模块规则、解析方式、目标、缓存和优化选项。

Loader 与插件扩展

使用 Loader 处理不同类型的模块和资源,并通过插件扩展编译与打包流程。

开发服务器与热更新

提供 webpack-dev-server 相关配置与 API,并支持 Hot Module Replacement 开发流程。

模块联邦

官方概念文档涵盖 Module Federation,用于理解跨构建共享和组合模块的机制。

官方动态

版本发布与项目路线

官方博客公开版本条目、版本发布信息及项目路线内容。

Webpack 5.109

官方博客列出的 Webpack 5.109 版本条目。

Webpack 5.108

官方博客列出的 Webpack 5.108 版本条目。

Roadmap 2026

官方博客公开的 2026 年项目路线内容。

官方资料

概念、配置与 API 文档

通过官方资料了解核心概念、配置选项、命令行接口、插件机制及参与贡献方式。

Webpack

从这里开始使用Webpack。