简体   繁体   English

用Grunt将Jade编译到相对文件夹

[英]Compile Jade to Relative Folder with Grunt

I am using grunt to compile my Jade files. 我正在用grunt编译我的Jade文件。 My folder structure looks like this 我的文件夹结构如下所示

-blocks
    -header
        -jade
            header.jade
        -html
    -nav
        ...

What I want to do is compile all the jade files for each block and then have the html files sent to their corresponding html folder. 我想要做的是为每个块编译所有的玉文件,然后将html文件发送到它们相应的html文件夹。 I've looked around but cant seem to find anything. 我环顾四周,但似乎找不到任何东西。 I've relatively new to grunt so I'm still getting the hang of it. 我相对较新,可以发牢骚,所以仍然可以掌握。 I'm thinking I may be able to achieve this using cwd somehow but I don't really understand how it works. 我想我也许可以通过cwd实现此目的,但我不太了解它是如何工作的。 I've put some code below which is untested /pseudo-ish 我在下面放置了一些未经测试的/ pseudo-ish代码

jade:{
    dist:{
        files:{
              src: "blocks/*/jade/*.jade", 
              dest: "html", 
              cwd: ?????? 
              ext: '.html'
             }
           }
       }

There is no magic. 没有魔术。 I found that it concatenates all the jade files to a single html. 我发现它将所有玉器文件连接到一个html中。 So here is the solution I can up with: 所以这是我可以解决的解决方案:

var jadeDir = 'blocks/*/jade/';
var htmlSources = 'html';
var jadeTransforms = [];

//Read all the jade files and create a html file for each
//To create the jade files create a literal object with src, dest and ext for
 //each file
 var jadefiles = grunt.file.expand({cwd: jadeDir}, '*.jade');
 for (var i =0, len = jadefiles.length; i < len; i++) {
    var jadefile = jadefiles[i];
    jadeTransforms.push({
       src: jadeDir + jadefile,
       dest: htmlSources + jadefile.substring(0, jadefile.indexOf('.jade')) +  '.html',
       ext: "html"
   });
  }

..... .....

 // Here is my jade setup based on jadeTransforms
  jade:{
   dist:{
     files:jadeTransforms
   }
  }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM