WebPack / Gulp / Babel 是什么?

What the hell is WebPack / Gulp / Babel?

在 2017 年,提到 WebpackGulp 或是 Babel 大多数前端应该都很熟悉了,至少应该听过它们,这篇文章试图用最简单的方式为初学者和会用但是还不理解的人讲解这些工具的作用和使用场景。

文章的每一部分都使用了 入门成本 它是什么 使用场景 大致原理 来帮助你理解这些工具,以便更好地选择使用哪一个来进行工作。

Gulp

入门成本

★☆☆☆☆ - 非常低

任何人都可以使用它,即便你是一个新手,也可以仅通过几行代码做许多事

它是什么?

Gulp 是一个 任务/工作流 自动化工具,简单的说,就是可以将一些需要反复进行多次的工作作为脚本来自动完成。

使用场景

  • 项目可能较小
  • 代码需要编译后才能运行在浏览器之中
  • 希望在代码修改时浏览器窗口中能实时预览变更
  • 代码处理以外的工作,例如自动按 Major.Minor.Patch 的方式变更版本号,或上传到指定服务器

工作原理

启动用户选择的任务 > 根据事先定义的规则寻找要处理的文件 > 传送文件内容到插件 (Plugin) 或自己的方法中进行修改 > 重复上一步直到任务中的工作完成 > 根据事先定义的规则将文件写入目标位置

WebPack

继续阅读WebPack / Gulp / Babel 是什么?