css - 如何使用 grunt-recess 编译 2 个单独的 LESS 文件

Question

我想用 grunt 凹槽编译 2 个单独的文件：

recess: {
            dist: {
                options: {
                    compile: true
                },
                files: {
                    'path/css/custom.css': ['path/less/custom.less'],
                    'path/css/animate.css': ['path/less/antimate.less'],

                },
            },
        }, 

在 grunt 退出之前，只有第一个文件正在编译。我哪里错了？

Answer 1

你应该试试这个

recess: {
    dist: {
        options: {
            compile: true
        },
        files: [
            {src: ['path/less/custom.less'], dest: 'path/css/custom.css'},
            {src: ['path/less/antimate.less'], dest: 'path/css/animate.css'}
        ],
    }
}, 

或者您可以启用动态扩展来编译文件夹中的每个 .less 文件：

recess: {
    dist: {
        options: {
            compile: true
        },
        files: [
            {
                expand: true,            // Enable dynamic expansion.
                cwd: 'path/to/less',     // Src matches are relative to this path.
                src: ['*.less'],         // Actual pattern(s) to match.
                dest: 'path/to/css/',    // Destination path prefix.
                ext: '.css',             // Dest filepaths will have this extension.
            },
        ],
    },
}, 

有关更多参考，请参阅http://gruntjs.com/configuring-tasks。

Answer 2

像这样：

recess: {
    dist: {
        options: {
            compile: true
        },
        files: {
            'dist/combined.css': [
                'src/main.css',
                'src/component.css'
            ]
        }
    }
}