What is webpack - XUEJS/webpack-docs GitHub Wiki

webpack 是一个 模块打包 工具。

WebPack 获取模块的依赖关系,并产生表示这些模块的静态资产

modules with dependencies ---webpack---> static assets

为什么要开发另外的模块打包工具?

现有的模块打包工具不适合用于大型项目(大的单页应用程序)。最紧迫的原因是开发其他的模块打包工具,可以通过模块化把[代码分割](Code Splitting)和静态资产完美地结合在一起。

我试图扩大现有的模块打包工具,但它不可能实现所有目标。

目标

  • 把依赖关系树拆分成块,按需加载
  • 保持较低的初始加载时间
  • 每个静态资产应该对应一个模块
  • 可以将第三方库作为模块集成
  • 可以自定义每一个模块捆绑部件
  • 适用于大项目

webpack有什么不同?

[代码分割](Code Splitting) Code Splitting

WebPack在依赖关系树中存在两种依赖关系:同步和异步。异步的依赖关系作为分割点,并形成一个新的chunk。当整个chunk树优化完成之后,会为每一个chunk生成一个文件。

了解更多有关[代码分割](Code Splitting)的内容。

加载器 Loaders

WebPack只能处理JavaScript的本身,但加载器可以将其他资源处理成JavaScript。这样就可以将每个资源形成一个模块。

了解更多有关[使用装载机](Using loaders)和装载机的内容。

智能解析

WebPack有一个聪明的解析器,可以处理几乎所有的第三方库。它甚至允许依赖关系表达式,例如:`require("./templates/" + name + ".jade")。它可以处理最常见的模块风格:CommonJSAMD

Read more about expressions in dependencies, CommonJs and AMD. 了解更多有关[依赖关系的表达](expressions in dependencies | Context),CommonJSAMD的内容。

[插件系统](Plugin system | plugins)

WebPack拥有丰富的插件系统。大多数的内部功能都基于这个插件系统。这使您可以根据需要自定义WebPack,并且可以发布常见的开源插件。

了解更多有关插件的内容。

⚠️ **GitHub.com Fallback** ⚠️