「这是我参与11月更文挑战的第27天，活动详情查看：2021最后一次更文挑战」

常用的自动化构建工具

前言

npm script确实能处理一些构建任务，但是相对一些比较复杂的构建过程，他就显的相当的吃力了，这时候我们就需要更加专业的构建工具

常用的自动化构建工具

我们市面上常用的：

• Grunt

  最早的前端构建系统了，他的生态非常的完善，用官方的一句话来说Grunt插件几乎可以帮助你完成任何一件事情，但是呢他的工作过程是基于临时文件的磁盘读写，所以构建速度相对来说比较慢；

  例如：我们对我们项目中的scss文件进行操作，我们一般是先进行文件的编译，再去自动添加自有属性的前缀，再去压缩代码。

  在Grunt中每一步都会有磁盘读写的操作，scss文件的编译后，就会有一次临时文件的生成，然后下一步再去读取这个临时文件，如果项目越多，文件读取次数越多，构建速度就越来越慢。

• Gulp

  Gulp很好的处理了Grunt的构建速度的问题，因为他是基于内存实现的，也就是说他的构建是基于内存中进行操作，相对于磁盘的读写就快了很多，而且它支持同时执行多个任务，效率上高了不少，而且他的使用方式先对于Grunt也简单易懂，而且他的生态也十分的完善

• Fis

  Fis是百度的前端团队推荐的构建系统，FIS相对之前两个微内核的特点，他更像一个捆绑套餐，他将我们的需求尽可能都集中在内部了，例如：资源加载、模块化开发、资源部署甚至是代码优化

诶看到这里，就有人问了webpack去哪里了？别着急，严格来说webpack其实应该算是模块打包工具，所以说不在我们这一次的讨论范围之内

小结

如果你是初学者的话可能FIS可能更适合你，如果你要求灵活多变的话Grunt、Gulp是你更好的选择