Node.js 如何设置grunt文件以监视和编译更少的文件

我试图在开发过程中使用grunt将较少的文件编译成css。同时，观看并重新加载。我写的文件是：

module.exports = function(grunt) {
grunt.initConfig({
    less: {
        development: {
            options: {
                compress: true,
                yuicompress: true,
                optimization: 2
            },
            files: {
                // target.css file: source.less file
                "public/css/bootstrap.css": "./public/less/bootstrap.less"
            }
        }
    },
    watch: {
        styles: {
            // Which files to watch (all .less files recursively in the less directory)
            files: ["public/less/*"],
            tasks: ['less'],
            options: {
                livereload: true,
            }
        }
    }
});

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

grunt.registerTask('default', ['watch']);
};

我在我的项目根目录中将其保存为gruntfile.js。我做错了什么

PS：我正在使用forever启动我的应用程序，在同一个终端窗口中，我正在使用命令grunt watch，但是当我更改较少的文件时，什么也没有发生

PPS：我的文件结构如下：

root
  -- public
    -- less
    -- css

如上所示，我的主less文件位于root/public/less/bootstrap.less，我希望css在root/public/css/bootstrap.css处编译

---

非常感谢

您的设置似乎很好，但我在这里发现了一个问题。。。也许它能解决你的问题

"public/css/bootstrap.css": "./public/less/bootstrap.less"
                             ^^

您的url是相同的，但在第二次出现时，您添加了额外的“/”我认为如果您删除此项，它将起作用

这是我自己的代码，运行良好

module.exports = function(grunt){
    grunt.initConfig({
        //pkg:grunt.file.readJSON('package.json'),
        less:{
              development:{
                  options:{
                      compress: true,
                      yuicompress: true,
                      optimization: 2
                  },
                files:{
                    'webroot/css/meer/index/index2.css' : 'webroot/css/meer/index/index2.less'
                }
              }
        },
        watch: {
            styles:{
                options:{
                    livereload: true,
                    spawn: false,
                    event: ['added','deleted','changed']
                },
                files:['webroot/css/meer/index/*.less'],
                tasks:['less']
            }
        }
    });
    grunt.loadNpmTasks('grunt-contrib-less');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.registerTask('default',['watch']);
}

---

嗨，博格丹。有两件事：我的文件没有引起上述问题的那一行，其次，上面的代码甚至没有编译css。说清楚一点，什么也没发生。我的less既没有被编译，也没有重新加载浏览器。请尝试使用

grunt--verbose

。它应该列出它正在监视的文件，并提供关于问题可能是什么的更多信息。我在您的配置中看不到这个问题。为了以后的参考，当我尝试使用--verbose时，我可以看到grunt正在工作，但是它没有在public/less目录及其子目录中监视更少的文件。我正在编辑的文件位于public/less/something/myfile.less中，因此Grunt更改它不会触发任何操作。一旦我意识到我已将配置更改为public/less/*/*这十个选项有效。@WagnerMatosUK您也可以在解决问题时发布自己的答案，并将其标记为正确。它将帮助将来遇到相同问题的用户快速找到解决方案。