创建自定义任务（高级）

QMUI Web 支持在内置工作流原有任务的基础上增加自定义的任务，通过特定的格式建立任务文件，可以调用 QMUI Web 工作流中的公共配置和组件来编写自定义任务，适用于需要针对项目添加额外的流程。

如何创建自定义任务

对 QMUI Web 来说，创建自定义任务只需要在配置文件（UI_dev/qmui.config.js）中增加 customTasks 字段，传入自定义任务的任务名和所在的 JavaScript 文件的相对路径即可（相对 qmui_web 目录），例如：

  1. UI_dev
  2. ├── qmui.config.js
  3. ├── project
  4. ├── qmui_web
  5. └── testTask.js
  6.             
  1. // qmui.config.js
  2. module.exports = {
  3.     /**
  4.      * 模板 include 引擎
  5.      *
  6.      */
  7.     'template': {
  8.         'openIncludeFunction': true,
  9.         'includePrefix': '@@'
  10.     },
  12.     /**
  13.      * 增加自定义任务
  14.      */
  15.     'customTasks': {
  16.         'testTask': '../testTask.js'
  17.     }
  18. };
  1. // testTask.js
  2. module.exports = (gulp, mix) => {
  4.     const taskName = 'testTask';
  6.     gulp.task(taskName, done => {
  8.         // Custom task logic code
  9.         mix.util.log('testTask execute succeed');
  11.         done();
  12.     });
  14.     // Task Description (For gulp list)
  15.     mix.addTaskDescription(taskName, 'Custom Task testTask');
  16. };

如上面的示例中的 testTask.js，自定义任务需要按照特定的格式编写，这样自定义任务才可以接入 QMUI Web 的内置工作流，并可以使用内置工作流中的公共配置和组件，为了方便开发者创建自定义任务，QMUI 的 Yeoman 脚手架 generator-qmui 增加了自定义任务的子模板，可以快速创建符合规范的自定义任务文件，例如：

  1. #安装 Yeoman，如果本地已安装可以忽略
  2. npm install -g yo
  3. #安装 QMUI 的模板，如果本地已安装可以忽略
  4. npm install -g generator-qmui
  5. #在需要创建自定义任务文件的目录执行以下命令
  6. yo qmui:task fileName;