Grunt
狐七 3/30/2022 工程化
# 1. Grunt的特点
查看答案
Grunt是最早的前端构建系统，插件生态非常的完善。
由于其工作过程是基于临时文件实现的，每一步都要读写磁盘，所以构建速度相对较慢。
# 2. Grunt的使用步骤
查看答案
- 在项目中安装一个Grunt的开发依赖
npm i grunt - 在根目录下添加一个
gruntfile.js文件，进行配置 - 文件中定义一些需要 Grunt 自动执行的任务，需要导出一个函数，此函数接收一个 grunt 形参，内部提供一些创建任务是可以用到的API
- 在命令行中
grunt foo去运行这些任务
# 3. Grunt如果任务失败如何表示？
查看答案
- 同步任务：失败任务只要返回false即可
- 异步任务：在done函数中返回false即可
# 4. 前面任务失败后，如何让后面的任务继续执行呢？
查看答案
执行的时候用grunt --force即可
# 5. Grunt如何配置多目标任务？
查看答案
多目标模式，可以让任务根据配置形成多个子任务
- 用
grunt.registerMultiTask注册多目标任务build - 直接执行任务
build - 也可以执行其中一个子任务
build:css
# 6. Grunt如何在函数中拿到配置、目标和值？
查看答案
- options中的东西通过
this.options()方法去拿 - 目标任务名通过
this.target去拿 - 目标任务对应的值通过
this.data去拿
注意：如果多任务中，目标任务本身也有options，则会对外面的options进行覆盖
# 7. Gulp常用插件及功能
查看答案
插件机制是Grunt的核心，一般我们都是通过通用的构建任务构成的。插件的命名规则都是grunt-contrib-<taskName>
- clean：插件用来清除我们在项目开发当中产生的临时文件
- grunt-sass：将sass转化成css
- grunt-babel：编译ES6的js
- grunt-contrib-watch：监听文件修改并自动编译