gruntjs - grunt watch 编译少但不生成 css

Question

Grunt watch 编译了我的 LESS 文件，但没有生成 CSS 文件。我不知道问题是什么。有人可以帮忙吗？

这是我的咕噜声代码：

module.exports = function(grunt) {

grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-contrib-watch');

grunt.initConfig({ 
    pkg: grunt.file.readJSON('package.json'), 
    less: {
        options: {
            paths: 'less',
            yuicompress: true
        },
        files: {
            'styles.css': 'less/button.less'
        }
    },

    watch: {
        less: {
            files: 'less/*.less',
            tasks: 'less'
        }
    }
});
}

这是我的package.json代码：

{
  "name": "project-name",
  "version": "1.0.0",
  "description": "Awesome project",
  "devDependencies": {
    "grunt-contrib-less": "^1.4.1",
    "grunt-contrib-watch": "^1.0.0"
  }
}

请参阅下面的文件夹结构：

Grunt Watch 工作正常：

Answer 1

Grunt 期望你的less任务配置有一个或多个 _targets。每个可以任意命名的目标都有一个files对象。

在您的配置中，Grunt 认为这files是target，因此控制台输出显示Running less:files。当 Grunt 没有files在files目标中找到对象时，它会继续前进。

为了修复您的配置，您必须添加一个将包装该对象的目标files对象。例如，

less: {
    options: {
        paths: 'less',
        yuicompress: true
    },
    dev: {
        files: {
            'styles.css': 'less/button.less'
        }
    }
},

有关 Grunt 任务配置和目标的更多信息，请参阅文档。