Wie kompiliert Jade-Dateien in einen Zielordner mit Grunzen

Question

Für eine einzelne Seite app kopieren, die ich arbeite, habe ich die folgende Struktur:

• dist
  • css
  • js
  • lib
  • partials
  • index.html
• src
  • css
  • js
  • lib
  • Ansichten
    • partials
    • index.jade

Das Verzeichnis dist wird vom Express-Server verwendet, um das Projekt zu bedienen. Ich habe trivial Grunzen Aufgaben (mit Grunzen-contrib-clean, Grunzen-contrib-Kopie) für die Reinigung dist und Kopieren src/css, src/js, src/lib zu dist. Das Problem liegt bei src/Ansichten. Dieses Verzeichnis enthält Jade-Dateien, die in HTML-Dateien kompiliert werden müssen. Nach der Kompilierung möchte ich sie in dist (index.html in der Dist-Wurzel, Partials als Unterverzeichnis).

Im Moment verwende ich die grunt-contrib-jade Aufgabe, um die Jade-Dateien zu kompilieren und zu kopieren. Ich möchte sie in dist kopieren, da ich die kompilierten HTML-Dateien nicht zur Quellcodeverwaltung hinzufügen möchte. Aber jetzt ist dies nicht wirklich praktikabel, da Sie jede Jade-Datei angeben müssen (jetzt gibt es nur wenige, aber das wird wachsen):

jade: { 
     compile: { 
      options: { 
       pretty: true 
      }, 
      files: { 
       // TODO make one line 
       'dist/index.html': ['src/views/index.jade'], 
       'dist/partials/banner.html': ['src/views/partials/banner.jade'], 
       'dist/partials/dashboard.html': ['src/views/partials/dashboard.jade'], 
       'dist/partials/navbar.html': ['src/views/partials/navbar.jade'], 
       'dist/partials/transfer.html': ['src/views/partials/transfer.jade'] 
      } 
     } 
    }, 

Gibt es eine Möglichkeit, die Grunzen-contrib-Jade zu verwenden Aufgabe (oder eine andere) mit einem Verzeichnisfilter? So:

jade: { 
     compile: { 
      options: { 
       pretty: true 
      }, 
      dir: { 
       'dist': ['src/views'] 
      } 
     } 
    } 

Answer 1

ich ein Upgrade endete 0,4 bis grunzen (was einige andere Probleme verursacht, aber das ich werde in der Lage sein zu handhaben).

Mit grunt Version 0.4 ist es möglich, verwenden grunt.file.expandMapping:

jade: { 
     compile: { 
      options: { 
       pretty: true 
      }, 
      files: grunt.file.expandMapping(['**/*.jade'], 'dist/', { 
       cwd: 'src/views', 
       rename: function(destBase, destPath) { 
        return destBase + destPath.replace(/\.jade$/, '.html'); 
       } 
      }) 

     } 
    }, 

Answer 2

wenig Klärung von Grunt wiki - expand mapping:

grunt.file.expandMapping(patterns, dest [, options]) 

Beachten Sie, dass während dieses Verfahren verwendet werden kann, um programmatisch eine Datei Array für eine Mehr Aufgabe zu erzeugen, die deklarativen Syntax dafür, dies zu tun, beschrieben in dem Abschnitt "Erstellen des Dateiobjekts dynamisch" von Configuring tasks guide ist bevorzugt.

die oben Konfiguration Angenommen wird wie folgt aussehen:

files: [ { 
    expand: true, 
    src: "**/*.jade", 
    dest: "dist/", 
    cwd: "src/views", 
    ext: '.html' 
} ]; 

gleiches Ergebnis mit deklarativer Konfiguration.