webpack

webpack功能

• 分析代码

• 转换代码

• 编译代码

• 输出代码

webpack的本质

本身是一个node模块，所以webpack配置构建文件遵循common.js规范的写法。

是一个打包模块的机制，只是把依赖的模块转化成可以代表这些包的静态文件。并不是什么commonjs或者amd之类的模块化规范。webpack就是识别你的 入口文件。识别你的模块依赖，来打包你的代码。至于你的代码使用的是commonjs还是amd或者es6的import。webpack都会对其进行分析。来获取代码的依赖。

webpack5大特点

代码拆分

支持异步加载

webpack 有两种组织模块依赖的方式，同步（默认）和异步（高级）。异步依赖作为分割点，形成一个新的块。在优化了依赖树后，每一个
异步区块都作为一个文件被打包。

Loader

支持任意模块，比如图片 、less、css等

Webpack 本身只能处理原生的 JavaScript 模块，但是 loader 转换器可以将各种类型的资源转换成 JavaScript 模块。
这样，任何资源都可以成为 Webpack 可以处理的模块。

智能解析

Webpack 有一个智能解析器，几乎可以处理任何第三方库，无论它们的模块形式是 CommonJS、 AMD 还是普通的 JS 文件。
甚至在加载依赖的时候，允许使用动态表达式 require("./templates/" + name + ".jade")。

插件系统

Webpack 还有一个功能丰富的插件系统。大多数内容功能都是基于这个插件系统运行的，还可以开发和使用开源的 Webpack 插件，
来满足各式各样的需求。

快速运行

Webpack 使用异步 I/O （NodeJs）和多级“缓存”提高运行效率，这使得 Webpack 能够以令人难以置信的速度快速增量编译。