如何使用grunt

Question

我不熟悉JS中的grunt和任务运行者，所以这看起来似乎是一个简单的问题，但我一直无法找到确切的工作答案。

我有：

concat: {
            options: {
                // define a string to put between each file in the concatenated output
                separator: '\n\n'
            },
            dist: {
                // the files to concatenate
                src: ['scripts/app.js', 'scripts/constant.js'
                ],
                // the location of the resulting JS file
                dest: 'scripts/custom.js'
            }
        },

此任务一起收集我的所有自定义文件。我想要的是为我的所有供应商文件做类似的事情。最后，我最终应该只有两个js custom.js使用我的连接缩小的代码，vendor.js使用连接的minfied库。

如何为此编写grunt配置。我是否需要完成两项不同的任务。如果我用不同的输入文件两次写上面的代码，它似乎运行最后一个代码。

Answer 1

grunt-contrib-concat可以配置为使用multiple-targets。

有关此主题的进一步文档，请参阅grunt文档中的multi-tasks和Task Configuration and Targets。

Gruntfile.js

对于您的方案，您需要配置与此类似的concat任务（注意：新的custom和vendor目标）：

module.exports = function(grunt) {

    grunt.initConfig({

        concat: {
            options: {
                separator: '\n\n'
            },
            custom: {
                src: ['scripts/app.js', 'scripts/constant.js'],
                dest: 'scripts/output/custom.js'
            },
            vendor: {
                // Modify the src and dest paths as required...
                src: ['scripts/vendor/foo.js', 'scripts/vendor/baz.js'],
                dest: 'scripts/output/vendor.js'
            }
        }

    });

    grunt.loadNpmTasks('grunt-contrib-concat');

    grunt.registerTask('concatenate', [
        'concat:custom', // <-- Targets in a task are called using a colon separator. 
        'concat:vendor'
    ]);

};

正在运行concat

使用上面提供的示例gist，您可以通过键入以下命令来运行concat任务：

$ grunt concatenate

配置选项

如果您需要custom和vendor目标的不同配置选项，则需要将options对象移动到其各自的目标中。正如here所述。

注意：使用示例要点，指定的options将适用于两个目标。