如何使用 grunt 从不同的 js 文件制作几个缩小文件

Question

我是 JS 中的 g运行t 和任务 运行ners 的新手，所以这似乎是一个简单的问题，但我一直无法找到确切的工作答案。

我有：

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 有连接缩小库。

如何为此编写 g运行t 配置。我需要做两个不同的任务吗？如果我用不同的输入文件两次写上面的代码，它似乎是 运行 最后的代码。

Answer 1

grunt-contrib-concat can be configured to utilize multiple-targets.

有关此主题的更多文档，请参阅 grunt 文档中的 multi-tasks and 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

使用上面提供的示例要点，您可以通过 CLI 输入以下命令 运行 concat 任务：

$ grunt concatenate

配置选项

如果您需要对 custom 和 vendor 目标使用不同的配置选项，您需要将 options 对象移动到它们各自的目标中。正如所解释的 here.

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