如何创建引用其他 grunt 任务的 grunt 任务

Question

我有一个 grunt 文件，用于构建我的网络应用程序。

这个 grunt 文件使用了几个 grunt contrib 插件，例如 clean、copy、compass、cssmin 等，以正确构建 Web 应用程序.

这个 grunt 文件还应该处理生成 CSS 和复制文件以创建主题 CSS 文件。目前，我正在为每个主题的clean、copy 和compass（等）任务添加目标。

这在 grunt 文件中变得笨拙，并且在添加新主题时会变得困难且容易出错。

为了让事情更简单，我真的很想创建自己的自定义“主题”grunt 任务，该任务将在内部使用其他 grunt 贡献任务 (clean 、copy、compass 等）来执行指定主题的所有必要任务。

只需少量的主题配置数据（主要是它的源文件夹），我就有足够的信息来调用其他任务（因为主题源文件和目标文件是非常约定俗成的）。

我似乎找不到从我的自定义任务中调用任务的方法，我可以在其中以编程方式执行它并指定所有配置选项、文件等。

有人知道我该怎么做吗？

谢谢，埃德

Answer 1

grunt.initConfig({
    clean: {/!* clean task configuration *!/},
    copy: {/!* copy task configuration *!/},
    compass: {/!* compass task configuration *!/},
    cssmin: {/!* cssmin task configuration *!/}
});

grunt.registerTask('theme', function () {
    var tasks = [
            'clean',
            'copy',
            'compass',
            'cssmin'
    ];

    tasks.forEach(function (task) {
        grunt.task.run(task);
    });
});

Answer 2

我遇到了同样的问题并解决了。

请记住：grunt 是在 node 中运行的所有 JavaScript，所以你可以做任何 JavaScript 和 node 支持的事情。

我的解决方案是这样工作的：

首先，将核心应用程序的 grunt 的所有内容放在一个单独的 JavaScript 文件中，例如“grunt-my-app-core.js”。 在那个导出两个函数中，init(grunt) 和 getConfig(grunt, options)。

(function() {
    "use strict"; //enable ECMAScript 5 Strict Mode

    function init(grunt) {
    }

    function getConfig(grunt, options) {
        return {};
    }


    ///////////////////////////
    //   Exports
    exports = module.exports = {
        init: init,
        getConfig: getConfig
    };
})();

init(grunt)是加载和注册任务。可能是这样的：

/**
 * public API
 *
 * add all required settings to grunt
 * 
 * register task "dist" and task "doc"
 *
 * @param  {object} grunt   the grunt instance
 * @return {void}
 */
function init(grunt) {
    // overwrite platform specific setting get always unix like line feed char
    grunt.util.linefeed = '\n';

    // Load plugins provide necessary task.
    grunt.loadNpmTasks('grunt-contrib-clean');
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-less');

    grunt.registerTask('dist', ['clean:build', 'copy:build', 'copy:dist', 'uglify', 'less']);
    grunt.registerTask('doc', ['clean:doc', 'copy:doc']);
}

getConfig(grunt, options) 将构建并返回配置对象：

/**
 * public API
 *
 * will return a config object that have to be given as argument to "grunt.initConfig"
 *
 * @param  {object} grunt   the grunt instance
 * @param  {object|undefined} options to change some pathes
 * @return {object}         the configuration object for initConfig
 */
function getConfig(grunt, options) {

    options = options || {};

    var buildDir = options.buildDir || "build/";
    var distDir = options.distDir || "dist/";
    var docDir = options.docDir || "doc/";

    // ... doing some stuff to collect files or what ever ...

    return {
        clean: {
            build: {
                src: [buildDir]
            },
            doc: {
                src: [docDir]
            }
        },
        copy: {
            // ...
        }   
        // ... add here all the stuff you like to config ...
    };
}

然后，您的主题项目中的Gruntfile.js 可能非常短，并且不需要您的核心应用程序的所有内容。可能是这样的：

/**
 * Module dependencies.
 */
var gruntMyApp = require("../my-app/grunt-my-app-core.js");

/*global module:false*/
module.exports = function(grunt) {

    var config = gruntMyApp.getConfig(grunt);

    // ... extend config, if you need it

    grunt.initConfig(config);

    // will register Task "dist" and "doc"
    gruntMyApp.init(grunt);

    // Default task.
    grunt.registerTask('default', ['dist', 'doc']);
};

现在，如果您在核心应用上更改某些内容，所有主题都会得到这个。您唯一需要更新手册的是package.json 文件中的devDependencies。

Answer 3

就这么简单：

concat: {
  web: {
    src: ['web/**/*.js'],
    dest: 'dist/main.js'
  }
},

uglify: {
  server: {
    src: '<%= concat.web.dest %>',
    dest: '<%= concat.web.dest %>.min.js'
  }
},

Answer 4

我似乎找不到从自定义任务中调用任务的方法 我可以在哪里执行并指定所有配置选项、文件等。 以编程方式。

我认为您不能使用特定配置运行 grunt 多任务，因为多任务配置是从任务配置中指定的目标中读取的。

因此，一种方法是在运行之前修改任务配置。

这是一个非常基本的例子：

grunt.registerMultiTask('theme', function() {
    var themeName = this.options().name;
    grunt.config.set('yourOtherTask.dist.options.name', themeName);
    grunt.task.run('yourOtherTask');
});