Comment copier des fichiers jade compilés dans un dossier de destination en utilisant grunt

Pour une single page app que je travaille, j'ai la structure suivante:

  • dist
    • css
    • js
    • lib
    • partiels
    • index.html
  • src
    • css
    • js
    • lib
    • vues
      • partiels
      • index.jade

Répertoire dist sera utilisé par l'express serveur pour servir le projet. J'ai trivial grunt tâches (à l'aide de grunt-contrib-propregrunt-contrib-copie) pour le nettoyage dist et la copie src/csssrc/jssrc/lib à dist.

Le problème, c'est src/vues. Ce répertoire contient jade fichiers qui doivent être compilées dans des fichiers html. Après la compilation je veux dist (index.html dans la dist racine, les partiels comme subdir).

Pour le moment je suis en utilisant le grunt-contrib-jade tâche de compiler et de copier le jade fichiers. Je veux les copier à dist, car je ne veux pas ajouter de la compilation des fichiers html à la source de contrôle. Mais maintenant, ce n'est pas vraiment réalisable, puisque vous devez spécifier tous les jade fichier (maintenant il ya seulement quelques-uns, mais qui va se développer):

   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']
            }
        }
    },

Est-il possible d'utiliser le grunt-contrib-jade tâche (ou un autre) avec un filtre de répertoire? Comme ceci:

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

source d'informationauteur asgoth

  1. 20

    Peu de clarification de Grunt wiki - développer la cartographie:

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

    Notez que bien que cette méthode peut être utilisée pour générer par programmation un des fichiers de la matrice de multi tâche, la syntaxe déclarative pour cela est décrit dans le "Bâtiment les fichiers objet de façon dynamique" de la La configuration des tâches guide est préféré.

    En supposant que le ci-dessus, la configuration ressemblera à ceci:

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

    Même résultat avec déclaratif de configuration.

  2. 10

    J'ai fini la mise à niveau vers grognement de 0,4 (qui cause d'autres problèmes, mais que je vais être capable de gérer).

    Avec grunt la version 0.4, il est possible d'utiliser grunt.fichier.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');
                }
            })

        }
    },
  3. 3

    Si vous souhaitez modifier uniquement l'extension des fichiers .le jade .html, une autre option serait d'utiliser le flatten et ext paramètres comme suit: 

    jade: {
    compile: {
        options: {
            data: { debug: false, title: 'My awesome application' }
        },
        files: grunt.file.expandMapping(['**/*.jade'], '<%= yeoman.dist %>/views', {
            cwd: '<%= yeoman.app %>/views',
            flatten: true,
            ext: '.html'
       })
    }
}

    Ou encore mieux (comme expliqué ici): 

    jade: {
    compile: {
        options: {
            data: { debug: false, title: 'My awesome application' },
            pretty: true
        },
        files: [
            {
                expand: true,
                cwd: '<%= yeoman.app %>/views',
                src: ['**/*.jade'],
                dest: '<%= yeoman.dist %>/views',
                ext: '.html'
            }
        ]}
}

    Grâce.