Używając Grunt concat, jak zautomatyzować łączenie tego samego pliku z wieloma innymi plikami?

Question

Używając Grunt concat, jak zautomatyzować łączenie tego samego pliku z wieloma innymi plikami?

Aby połączyć dwa pliki, wygląda to mniej więcej tak:

  concat: {
    src: ['common.js','js/app.js'],
    dest: 'assets/js/app.js'
  }

A jeśli chcę połączyć cały folder plików w jeden, wygląda to mniej więcej tak:

  concat: {
    src: ['dev/*.js','],
    dest: 'prod/js/app.js'
  }

Ale załóżmy, że mam plik, który chcę połączyć z 10 lub 20 innymi plikami, i chcę, aby były osobno? Innymi słowy, oto czego szukam:

A.js + B.js = AB.js
A.js + C.js = AC.js
A.js + D.js = AD.js
A.js + E.js = AE.js

I tak dalej... Mówiąc dokładniej, mogę dowiedzieć się, jak konkatować pliki jeden po drugim, zgodnie z opisem, ale chcę dowiedzieć się jak określić A. js z przykładu, i mieć go concat na dowolnym pliku w podanej ścieżce. Więc to czego chcę to:

A.js + dev/*.js = AB.js, AC.js, AD.js, AE.js ...

W pseudo-kodzie, oto czego chcę:

  concat: {
    src: ['common.js', 'dev/*.js','], // common.js gets concatenated to each file in this directory
    dest: 'prod/js/*.js' // each file in src gets saved separately in dest 
  }

Byłabym wdzięczna za każdą pomoc, mam problem ze znalezieniem informacji jak to zrobić

13

gruntjs concat

Author: jonschlinkert, 2012-10-04

Source

1 answers

score 19 · Accepted Answer

Wbudowane concat zadanie (polecam spojrzeć na źródło btw) nie obsługuje niczego takiego jak dest: 'prod/js/*.js', trzeba by określić każdy cel wyjściowy osobno, co jest przesadą w Twoim przypadku.

Najlepiej jest po prostu napisać własny kod (być może owinąć go w niestandardowe zadanie), to dość proste. Oto prosty wrap wielozadaniowość. Nie obiecuj, że jest solidny i bezpieczny w użyciu:)]}

  grunt.registerMultiTask('wrap', 'Wraps source files with specified header and footer', function() {
        var data = this.data,
            path = require('path'),
            dest = grunt.template.process(data.dest),
            files = grunt.file.expandFiles(this.file.src),
            header = grunt.file.read(grunt.template.process(data.header)),
            footer = grunt.file.read(grunt.template.process(data.footer)),
            sep = grunt.utils.linefeed; 

        files.forEach(function(f) {
            var p = dest + '/' + path.basename(f),
                contents = grunt.file.read(f);

            grunt.file.write(p, header + sep + contents + sep + footer);
            grunt.log.writeln('File "' + p + '" created.');
        });
  });

Feed it with a config like this:

wrap: {
    html: {
        header: '<%= project.partials %>/head.html',
        footer: '<%= project.partials %>/footer.html',
        src: [
            '<%= project.pages %>/index.html',
            '<%= project.pages %>/about.html',
            '<%= project.pages %>/blog.html'
        ],
        dest: '.'   // destination *directory*, probably better than specifying same file names twice
    }
}

Na wszelki wypadek Zaktualizowałem też Twoje skrzypce: http://jsfiddle.net/dipish/hKkGX/