如何使用grunt将编译的jade文件复制到目标文件夹

对于我正在处理的单页应用程序，我有以下结构：

• DIST
  • CSS
  • JS
  • LIB
  • 谐音
  • 的index.html
• SRC
  • CSS
  • JS
  • LIB
  • 意见
    • 谐音
    • index.jade

目录dist将被快递服务器用来为项目服务。 我使用grunt-contrib-clean ， grunt-contrib-copy来清理dist并将src / css ， src / js ， src / lib复制到dist 。

问题在于src / views 。 这个目录包含需要被编​​译成html文件的jade文件。 编译后，我想要他们dist （index.html中的dist根，partials作为子目录）。

目前我正在使用grunt-contrib-jade任务来编译和复制玉文件。 我想将它们复制到dist，因为我不想将编译的html文件添加到源代码pipe理。 但现在这是不可行的，因为你必须指定每个翡翠文件（现在只有less数，但会增长）：

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

有没有办法使用grunt-contrib-jade任务（或另一个）与目录filter？ 喜欢这个：

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

Answer 1

来自Grunt wiki的一点澄清- 展开映射 ：

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

请注意，尽pipe此方法可用于以编程方式为多任务生成文件数组，但在“ configuration任务”指南的 “dynamic构build文件对象”部分中描述的声明性语法是首选。

假设如上所述，configuration将如下所示：

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

与声明性configuration相同的结果。

Answer 2

我结束了升级到咕噜0.4（这会导致一些其他问题，但我将能够处理）。

使用grunt 0.4版本，可以使用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 3

如果您只想将.jade文件的扩展名更改为.html，则另一个选项将使用flatten和ext参数，如下所示：

 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' }) } } 

甚至更好（正如这里所解释的）：

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

谢谢。