WebPack系列教程(三):什么是WebPack
2016-03-09 10:00
513 查看
webpack是一个模块打包器
webpack模块根据之间的依赖,打包生成最终代表那些模块的静态资源。
![](http://webpack.github.io/assets/what-is-webpack.png)
我试图扩展已经存在的模块打包器,但是它们很难达到所有的预期。
保证初始加载时间低;
所有静态资源都能作为模块;
能集成第三方库作为模块;
能自定义模块打包器几乎所有的过程;
适合大型项目;
阅读更多关于代码拆分
阅读更多关于Using-Loaders和Loaders
阅读更多关于expressions in dependencies,CommonJs和AMD。
阅读更多关于插件
webpack模块根据之间的依赖,打包生成最终代表那些模块的静态资源。
![](http://webpack.github.io/assets/what-is-webpack.png)
为什么还需要重新做一个模块打包器
已经存在的模块打包器不适合于大型项目(如大型的单页应用程序)。我们开发另一个模块加载器最直接的原因就是代码拆分和模块化的静态资源需要无缝集成。我试图扩展已经存在的模块打包器,但是它们很难达到所有的预期。
目标
拆分依赖树到按需加载的分块当中;保证初始加载时间低;
所有静态资源都能作为模块;
能集成第三方库作为模块;
能自定义模块打包器几乎所有的过程;
适合大型项目;
webpack有哪些不一样的地方?
代码拆分
在webpack的依赖树中存在两种依赖方式:同步和异步。异步依赖根据拆分点形成新的分块。当这些分块树被优化后,模块文件就被分发到各个分块中。阅读更多关于代码拆分
Loaders
webpack本身只能处理javascript,但是loaders 能将其他资源转换为javascript。通过这种方式所有资源都形成了模块。阅读更多关于Using-Loaders和Loaders
Clever parsing
webpack有一个很强大的解析器,它能处理几乎所有的第三方库。它甚至允许依赖当中存在表达式,像require("./templates/" + name + ".jade");它能处理几乎所有的模块加载方式:CommonJs和AMD。
阅读更多关于expressions in dependencies,CommonJs和AMD。
插件系统
webpack的特色是有丰富的插件系统。webpack的许多内部特性都是基于插件系统的。插件系统允许你根据需要自定义webpack,并通过开源分发自己的插件。阅读更多关于插件
相关文章推荐
- WebPack系列教程(二):动机
- WebPack系列教程(一):目录
- webpack使用笔记
- Webpack your bags(中文翻译)
- Webpack 学习笔记
- webpack初识!
- 一小时包教会 —— webpack 入门指南
- Webpack 新手入门
- Karma 4 - Karma 集成 Webpack 进行单元测试
- webpack备忘录
- webpack的问题;
- Webpack的安装、配置与执行
- webpack
- webpack入门(七) API in LOADERS
- 基于webpack的模块化构建
- webpack入门(六) API in modules
- webpack入门(五)webpack CLI
- webpack入门(四)webpack的api 2 module
- Webpack
- webpack 发布配置