小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。
Rollup
Rollup 是一个 JS 模块打包器，它与 Webpack 定位不同，它更专注于 JS 类库的打包工作。操作过程和webpack差不多，它也是可以以命令行或者配置文件（rollup.config.js）的方式来完成打包操作的。默认支持 ES Module 中的 import/export 语法还有相对路径（Webpack中相对路径要配合path模块）。
Tree-shaking 是 Rollup 一个重要特性，Webpack 版本在 2 版本的时候也有这个性质，但是应用还是不是很成熟。
注意点：
1. Rollup 更适合用来开发一些纯 JS 库。
2. Rollup 不支持代码分割。
3. Rollup 默认只支持 import/export 方式导入导出，如需使用 CommonJS 模块规范，则必须单独配置插件。
4. Rollup 不能直接处理导入的第三方依赖模块，需要插件@rollup/plugin-node-resolve 来处理路径才能使用。
5. 开发服务器 Dev Server 需要通过 rollup-plugin-server 插件来实现。
Esbuild
Esbuild 是新一代的 JS 打包工具，尤大大最新推出的 Vite 工具内置了它，也在内部很多地方使用了其中的功能（transform），但并没有作为打包使用，而是选择了更加灵活的 Rollup ，主要是它针对的一些构建应用的重要功能仍然还在开发中，如代码分割和CSS处理方面。
它现在支持的能力：
- 支持
CommonJS模块规范导入导出。 - 支持
ES Module模块规范导入导出。 - 支持
Tree-shaking。 - 压缩代码。
- 支持
Source Map。 - 支持
JSX文件转为JS。
Esbuild 快的原因：
-
它由
GO语言编写，GO语言在编译运行层次上比JS更具有性能优势。 -
GO语言天生具有多线程能力，能并行处理代码解析工作。
Gulp/Grunt
一个基于流（任务）的自动化构建工具，Gulp 是基于 Node 构建的，利用它流的能力，它强调的是前端开发流程规范化管理，从 Vue 等 SPA 框架出现后，它慢慢不介入业务的实际生产开发中了。
什么时候用 Gulp/Grunt：
如果你的应用模块依赖简单，没有用到模块化的概念，只需要简单的合并压缩，就可以使用。但如果你的整个项目都是用模块化管理的，互相依赖模块很强，建议还是用 Webpack。
注意点：
Gulp所处理的任务大多都是以插件的形式存在的，所以在使用前，要先安装插件依赖。Grunt是Gulp的前身，Gulp及其了它的精华。Gulp相比Grunt更加简洁，设计理念更合理，核心API只有五个。Gulp每个插件只完成一个功能。
打包压缩一个 Less 文件的过程，Gulp 与 Grunt 的对比：
Gulp：执行 IO 操作，读取 Less 文件，转成 CSS 文件，压缩代码，存储。
Grunt：执行 IO 操作，读取 Less 文件，转成 CSS 文件，存储，再重新读取 CSS 文件，压缩，存储。
Parcel
一个极速零配置的 Web 应用打包工具，能支持打包各种文件。
注意点：
1. 无配置完成构建打包项目要求。
2. 内置常见场景的构建方案及其依赖，无需安装各种依赖。
3. 能以HTML为入口，自动检测和打包依赖资源。
4. 默认支持模块热替换，真正的开箱即用。
5. Transform 过程是通过 Plugins 来处理的，不像 Webpack 是通过Loader。
使用场景：
偶尔用来快速启动一个服务进行开发。Parcel 支持Vue3，但尤大大不推荐使用，直接使用 Vite 更好。
主要记住它主打的是零配置模式！！！
至此，本篇文章就写完啦，撒花撒花。
希望本文对你有所帮助，如有任何疑问，期待你的留言哦。
老样子，点赞+评论=你会了，收藏=你精通了。
