grunt.js - Wiele miejsc docelowych kiedy minifying plików

Question

Moi grunt.js ma typowy zadanie minifikacji:

min: { 
    dist: { 
     src: ['dist/precook.js'], 
     dest: 'dist/precook.min.js' 
    } 
} 

Co jest najprostszym sposobem, aby mieć wiele plików DEST? Chciałbym minify do:

• dist/precook.min.js
• przykład/js/vendor/precook.min.js

built-in min task nie wydaje się wspierać wielokrotność miejsc docelowych, więc zakładam, że można to osiągnąć za pomocą prostego zadania "kopiowania". Czy ktoś może wskazać mi właściwy kierunek?

Answer 1

użyję grunt-contrib-copy wtyczki:

Instalacja z npm:

npm install grunt-contrib-copy 

Zmienić grunt.js (dodanie definicji zadania kopiowania i skopiuj wtyczkę ładowania):

... 
    copy: { 
     dist: { 
      files: { 
       'example/js/vendor/': 'dist/precook.min.js' 
      } 
     } 
    } 
    ... 

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

Opcjonalnie register copy in to grunt's default task.

Dodatkowym pięknem jest to, że możesz teraz wykonywać wszystkie inne zadania kopiowania. Obsługiwane są nawet wzorce, np. Skopiuj wszystkie pliki (min. 'dist/*.min.js').

Answer 2

Jest to metoda alternatywna (obok @jalonen „s roztworze), które mogą w interesujący dla ciebie, jeśli używasz requirejs zmodularyzować swój projekt, a następnie można użyć requirejs optimizer do minify moduły.

Przede wszystkim trzeba dodać grunt-contrib-requirejs do projektu:

npm install grunt-contrib-requirejs --save-dev 

Grunt konfiguracji:

 requirejs: { 
      production:{ 
       options:{ 
        // don't include libaries when concatenating/minifying 
        paths:{ 
         angular:'empty:', 
         jquery:'empty:' 
        }, 
        baseUrl:'path/to/src/js', 
        dir:'path/to/target/js', 
        // keeps only the combined files 
        removeCombined:true, 
        modules:[ 
         {name:'app', exclude: ['moduleA', 'moduleB']}, 
         {name:'moduleA'}, 
         {name:'moduleB'} 
        ] 
       } 
      } 
     } 
     ... 

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

Objaśnienie:

Powiedzmy masz tę zależność drzewo (-> oznacza zależy):

app -> moduleA -> moduleA1 
       -> moduleA2    
app -> moduleB -> moduleB1 
       -> moduleB2    

Po minifying będzie mieć trzy pliki:

• app (wersja minified od APP)
• moduleA (wersja minified z moduleA, moduleA1 i moduleA2)
• moduleB (minified wersja moduleB, moduleB1 i moduleB2)

Answer 3

miał podobny problem i stworzył grunt multi-task który uruchamia listę określonych zadań na wielu katalogach

za korzystanie z dokładnym przypadku: `` `

min: { 
    dist: { 
     src: ['dist/precook.js'], 
     dest: 'dist/precook.min.js' 
    } 
}, 
multidest: { 
    minifiedFiles: { 
     tasks: ['min'], 
     dest: [ 
      'dist/precook.min.js', 
      'example/js/vendor/precook.min.js' 
     ] 
    } 
} 

` ``

Answer 4

concat: { 
      css: { 
       src: ['UI.controls/assets/css/*.css'], 
       dest: 'UI.controls/assets/css/min/production.css' 
      }, 

      js: { 
       src: ['UI.controls/assets/js/*.js'], 
       dest: 'UI.controls/assets/js/min/production.js' 
      }, 

      js2: { 
       src: ['UI.core/assets/js/*.js'], 
       dest: 'UI.core/assets/js/min/production.js' 
      } 

     }, 

     cssmin: { 
      css: { 
       src: 'UI.controls/assets/css/min/production.css', 
       dest: 'UI.controls/assets/css/min/production.min.css' 
      } 
     }, 

     uglify: { 
      js: { 
       src: 'UI.controls/assets/js/min/production.js', 
       dest: 'UI.controls/assets/js/min/production.min.js' 
      }, 

      js2: { 
       src: 'UI.core/assets/js/min/production.js', 
       dest: 'UI.core/assets/js/min/production.min.js' 
      } 
     }, 


     watch: { 
      css: { 
       files: ['UI.controls/assets/css/*.css'], 
       tasks: ['concat:css', 'cssmin:css'] 
      }, 
      js: { 
       files: ['UI.controls/assets/js/*.js'], 
       tasks: ['concat:js', 'uglify:js'] 
      }, 

      js2: { 
       files: ['UI.core/assets/js/*.js'], 
       tasks: ['concat:js', 'uglify:js'] 
      } 

     }