css - 如何用 grunt 递归编译 less/sass 文件

Question

我有一个文件结构复杂的元素，其中有一些模块有自己的 css/less/sass 文件夹。

我想让 grunt 监视所有这些文件，并通过用 css 替换最后一个 lass/sass 文件夹将它们编译成目标文件。编译文件示例

root/less/style.less -> root/css/style.css

或

root/modules/mymodule/sass/file.sass -> root/modules/mymodule/css/file.css

我的 gruntfile 现在是:

    less: {
        development: {
            options: {
                paths: ["**/*"]
            },
            //files: {"css/main.css": "less/main.less"},
            files: [
                {
                    expand: true,
                    cwd: "**/*",
                    src: ["**/*.less"],
                    dest: "",
                    ext: ".css"
                }
            ]
        }
        // ,
        // production: {
        //     options: {
        //         paths: ["assets/css"],
        //         cleancss: true
        //     },
        //     files: {"path/to/result.css": "path/to/source.less"}
        // }
    },
    watch: {
      styles: {
        files: ['less/**/*.less'], // which files to watch
        tasks: ['less'],
        options: {
          nospawn: true
        }
      }
    }
});

但它不起作用。

Answer 1

我认为这是您的启动 (cwd) 和目标 (dest) 路径不正确。试试这个:

less: {
    development: {            
        files: [
            {
                expand: true,
                cwd: "root", // The startup directory
                src: ["**/*.less"],
                dest: "root", // Destination
                ext: ".css"
            }
        ]
    }
},