简介
quicktask 是一个基于 gulp 的工作流管理工具,旨在提供一个简单、快速、高效的前端开发解决方案。它支持多种自动化处理任务,如 js、css、图片等文件的压缩、合并、雪碧图等。
安装
使用 npm 安装 quicktask:
npm install --save-dev quicktask
安装完成后,即可在项目中使用 quicktask 提供的命令。
使用
执行任务
在项目根目录下创建名为 gulpfile.js
的文件,导入 quicktask:
const quicktask = require('quicktask');
定义任务:
quicktask.task('dev', ['copy', 'html', 'css', 'js', 'images'], () => { // ... })
执行任务:
gulp dev
目录结构
quicktask 默认约定项目目录如下:
-- -------------------- ---- ------- --- ----- - ------ --- ------------- - --- --- --- ------- - ------------- - --- ---- - --- ---- - --- --- --- ---- - ----- - --- ----- - --- ---- - --- --- - --- ----- - --- ------- - ------ --- -------- - ----- ---- --- ----------- - ---- ------ --- ------------ - ------
配置参数
quicktask 提供了丰富的可配置参数,可根据项目需要进行定制。
-- -------------------- ---- ------- ------------------ ----- ------- -- ------ ---- ------ -- ----- ------- --------- -- ------------- ----- - ---- ------------------ -- ---- ----- ----- ------- -- ------- ------- ----- -- ---- ---- -------- --- -- ---- -- ---- - ---- -------------------- -- --- ----- ----- ----------- -- ------- ------- ----- -- ---- --- -------- --- -- ---- -- --- - ---- ---------------- -- -- ----- ----- ---------- -- ------- ------- ----- -- ---- -- -------- --- -- ---- -- ------- - ---- --------------------------------- -- ------- ----- ----------- -- ------- -------- --- -- ---- -- ----- - ---- -------------------- -- ------- ----- -------------- -- ------- -------- --- -- ---- -- ---
示例
以 html 任务为例,在 gulpfile.js
中配置 html 任务:
-- -------------------- ---- ------- ------------------ ----- - ---- ------------------ ----- ------- ------- ----- -------- --- -- --- ---------------------- -- -- - ------ ----------------------- ---
在 src
目录下创建 index.html
文件:
-- -------------------- ---- ------- --------- ----- ------ ------ ----- --------------- -- ------------------------ ------- ------ ---------- --------------- ------- -------
在终端执行任务:
gulp html
即可在 dist
目录下生成压缩后的 index.html
文件。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/5f2290c4403f2923b035c6cc