Question

我有下一个结构：

jade
├── _skeleton.jade
├── _header.jade
├── _footer.jade
|
├── includes
│ └── _include-on-index.jade
│ └── _include-on-page-1.jade
│ └── _include-on-all-pages.jade
|
├── pages
│ └── index.jade
│ └── page-1.jade
│ └── page-2.jade
│ └── page-3.jade

我需要像某些应用程序一样设置jade编译（例如Prepros）。

这意味着如果我编辑page-3.jade我只需要编译page-3.jade，如果我编辑以_ .jade开头的文件，我不需要编译这个_ .jade文件，如html，但我需要编译包含此_ * .jade文件的所有.jade文件

例如，当我编辑文件_header.jade时，我需要编译包含_header.jade的所有文件，如果我编辑_include-on-index.jade我需要编译没有_的文件，包括_include-on-index.jade

我可以用Grunt做这件事吗？

Answer 1

您可以使用 grunt-contrib-jade 和 grunt-contrib-watch 并为此玉文件插入监视。

所以，每次更改.jade文件时，手表都会看到此更改，并会编译您的文件。

假设我有这棵树：

<强>玉/模板我所有的.jade文件

<强>玉/编译的模板使用我为.html编译的所有jade模板

配置jade：

//Jade ===============================
            config.jade = {
                    compile: {
                        options: {
                            client: false,
                            pretty: true
                        },
                        files: [ {
                          cwd: "jade/templates",
                          src: "**/*.jade",
                          dest: "jade/compiled-templates",
                          expand: true,
                          ext: ".html"
                        } ]
                    }
                }

配置观看：

    //Watch ===============================

    config.watch = {
         scripts: {
            files: ["jade/**/*.jade"]
            ,tasks: ["dev"]
         }
    }

我希望这能回答你的问题。

咕噜。包含child（_ *。jade）时编译所有.jade文件

1 个答案: