node.js 使用 grunt-contrib-less 编译更少的文件将不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/15094667/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-02 13:42:16  来源:igfitidea点击:

Compile less files with grunt-contrib-less won't work

node.jslessgruntjs

提问by mybecks

I'm using Grunt for building my web project. I installed grunt-contrib-lesspackage und added a task to my grunt.initConfig({..});

我正在使用 Grunt 来构建我的 Web 项目。我安装了grunt-contrib-less包并添加了一个任务到我的grunt.initConfig({..});

less : {
            options: {
                paths: ['js/base']
            },
            files: {
                'js/base/*.css' : 'js/base/*.less'
            }
        }

when I run the target lessvia grunt less, it runs without errors but doesn't compile the less file to a css file.

当我通过less运行目标时grunt less,它运行时没有错误,但不会将 less 文件编译为 css 文件。

Running "less:files" (less) task

Done, without errors.

I have installed the lesscpackage via node, too. Doing lessc <source> <dest>works fine.

我也通过 node安装了lessc包。做得lessc <source> <dest>很好。

Currently I have pointed with the files optiondirectly to one dir which contains one less file for testing. Even if I write the whole file name into files option, it happens nothing...

目前,我已将文件选项直接指向一个目录,该目录包含少一个用于测试的文件。即使我将整个文件名写入files option,它也不会发生任何事情......

Later on I want to scan the whole js directory and compile all new modified *.less files.

稍后我想扫描整个 js 目录并编译所有新修改的 *.less 文件。

I have installed following versions:

我已经安装了以下版本:

grunt-cli v0.1.6
grunt v0.4.0
node v0.8.7
npm 1.1.49

BR, mybecks

BR,我的贝克斯

回答by Dominic Barnes

The glob pattern js/base/*.cssdoes not match any files, therefore there is no destination. Usually, tasks like this expect multiple inputs to combine into a single output. Also, bear in mind that lessis a multi-task, and putting filesas a child of lessis not doing what you expect. (it is treating it as a target, not a src/dest map)

glob 模式js/base/*.css不匹配任何文件,因此没有目的地。通常,像这样的任务期望多个输入组合成一个输出。另外,请记住,这less是一项多任务,并且将其files作为子项放置less并不是按照您的期望进行的。(它将其视为目标,而不是 src/dest 映射)

If you want a 1-1 transform of .less into .css, you can use dynamic expansion. (or you can define each src/dest pair manually, but who wants to do that?)

如果你想要 .less 到 .css 的 1-1 转换,你可以使用动态扩展。(或者您可以手动定义每个 src/dest 对,但谁想这样做?)

In your case:

在你的情况下:

less: {
    options: {
        paths: ['js/base']
    },
    // target name
    src: {
        // no need for files, the config below should work
        expand: true,
        cwd:    "js/base",
        src:    "*.less",
        ext:    ".css"
    }
}

回答by Michiel

I used Anthonies solution but stil had an error

我使用了 Anthony 解决方案,但仍然有错误

Warning: Object true has no method indexOf

If I changed the order putting expand trueas second it gave me the error

如果我将订单更改expand true为第二,它会给我错误

Unable to read "less" file

where "less" was the value of the first item in my list.

其中“less”是我列表中第一项的值。

I solved it by changing files into an array like this:

我通过将文件更改为这样的数组来解决它:

less: {
    options: {

            paths: ["js/base"]
        },
        files: [{
            expand: true,
            cwd: "js/base",
            src: ["**/*.less"],
            dest: "js/base",
            ext: ".css"
        }]
},

I used "grunt-contrib-less" : "^0.11.0"

我用了 "grunt-contrib-less" : "^0.11.0"

回答by Anthony Tambrin

This works for me, but modified to reflect this scenario:

这对我有用,但经过修改以反映这种情况:

less: {
    options: {
        paths: ["js/base"]
    },
    files: {
        expand: true,
        cwd: "js/base",
        src: ["**/*.less"],
        dest: "js/base",
        ext: ".css"
    }
},