如何创建和组织配置并注册Grunt任务

Question

我有一个grunt用于处理我的文件Js和SASS文件的项目。

目前，当我需要处理某些事情时，gruntfile.js即使我只想更改一个模块或SASS文件，也需要调用我内部的所有任务。

有没有一种方法可以创建自定义任务，仅运行sass部分，另一种方法仅创建模块进程，我可以在提示符下调用此任务？

这是我尝试过的，但没有成功：

    module.exports = function(gruntHome) {

    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),

        /* @CONCAT */
        concat: {
            home : {
                src: 'src/app/component/home/*.js',
                dest: 'src/app/component/home/concat/concat_config.js'
            }
        },

        /* @ANNOTATE */
        ngAnnotate: {
            options: {
                add: true
            },
            home: {
                files: {
                    'src/app/component/home/concat/concat_config.js': 'src/app/component/home/concat/concat_config.js'
                }
            }
        },

        /* @UGLIFY */
        uglify: {
            home: {
                src:  'src/app/component/home/concat/concat_config.js',
                dest: 'app/component/home/home.min.js'
            }
        }
    });


    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-ng-annotate');

    grunt.registerTask('gruntTask', ['concat', 'ngAnnotate', 'uglify']);
};

如果不可能的话，还有其他方法可以实现这个目标吗？因为我的gruntfile.js很大，所以即使我不需要处理所有事情，有时也要花很多时间。

编辑：

这此链接是一个相关的问题我做了以下提供关于这个问题的步骤。它将解决您在尝试执行此处操作时可能遇到的一些问题。希望它可以帮助其他人。

Answer 1

您可以通过以下方式组织艰苦的任务：

• config ：默认任务
• register ：调用多个默认任务的别名任务

您必须遵守的一些规则 ：

• 文件名必须与任务名称相同（例如：ngAnnotate.js-> task：ngAnnotate）
• 通过grunt插件将您的配置任务分组在一个文件中。 不要在配置任务中混用grunt-plugins，这里有注册任务。

• 配置任务的名称和注册任务是共享的，因此您无法设置home配置任务和home注册任务，因为当您用grunt home调用它时，grunt无法知道您要引用的任务。

  ├── Gruntfile.js
  └── grunt
  ├── config
  │ ├── sass.js
  │ ├── concat.js
  │ └── uglify.js
  └── register
  ├── GroupOfTasks.js
  └── AnotherGroupOfTasks.js
  
  
  

您Gruntfile.js将使用以下代码加载和配置grunt/config和grunt/register文件夹中的所有任务：

module.exports = function(grunt) {


    // Load the include-all library in order to require all of our grunt
    // configurations and task registrations dynamically.
    var includeAll;

    try {
        includeAll = require('include-all');
    }
    catch (e0) {
        console.error('Could not find `include-all` module.');
        console.error('Skipping grunt tasks...');
        console.error('To fix this, please run:');
        console.error('npm install include-all --save-dev');
        console.error();
    }

    /**
     * Loads Grunt configuration modules from the specified
     * relative path. These modules should export a function
     * that, when run, should either load/configure or register
     * a Grunt task.
     */
    function loadTasks(relPath) {
        return includeAll({
                dirname: require('path').resolve(__dirname, relPath),
                filter:  /(.+)\.js$/
            }) || {};
    }

    /**
     * Invokes the function from a Grunt configuration module with
     * a single argument - the `grunt` object.
     */
    function invokeConfigFn(tasks) {
        for (var taskName in tasks) {
            if (tasks.hasOwnProperty(taskName)) {
                tasks[taskName](grunt);
            }
        }
    }

    // Load task functions
    var taskConfigurations  = loadTasks('./grunt/config'),
        registerDefinitions = loadTasks('./grunt/register');

    // Run task functions to configure Grunt.
    invokeConfigFn(taskConfigurations);
    invokeConfigFn(registerDefinitions);

};

您的配置任务应如下所示（Eg：）sass.js：

module.exports = function(grunt) {
    grunt.config.set('sass', {
        dev: {
            options: {
                sourceMap: false
            },
            files: {
                'main.css': 'main.scss'
            } 
        }
    });

    grunt.loadNpmTasks('grunt-sass');
};

您将能够运行config任务，grunt sass以运行所有sass任务或grunt sass:dev仅运行一个任务。

注册任务应如下所示（例如：SassAndConcat要运行的任务sass和concat任务）：

module.exports = function(grunt) {
    grunt.registerTask('SassAndConcat', [
        'sass:dev',
        'concat:dev',
    ]);
};

现在您将能够运行grunt SassAndConcat。

如果您了解这一点，则可以通过在正确的时间运行正确的任务来更有效地运行Grunt任务。

不要忘记安装include-allNPM模块，以动态要求我们执行所有必需的配置和任务注册。