Grunt,Less和File Watching

Tho*_*ggi 28 less gruntjs

我正努力让咕噜咕噜地做点什么.我的项目看起来像这样:

/app
    /assets
        /components
        /stylesheets
            /less
                /file1.less
                /file2.less
                /file3.less
                /importAll.less
            /css
Run Code Online (Sandbox Code Playgroud)

我想这样,当file1,file2file3保存在importAll.less文件编译成CSS和投入/css/style.css.这是我得到的.

less: {
    development: {
        options: {
            paths: ["./assets/stylesheets/less"],
            yuicompress: true
        },
        files: {
            "./assets/stylesheets/css/style.css": "./assets/stylesheets/less/importAll.less"
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

我不确定如何让文件观察者工作.

Tho*_*ggi 54

我得到了以下工作!

module.exports = function(grunt) {
    grunt.initConfig({
        less: {
            development: {
                options: {
                    paths: ["./assets/stylesheets/less"],
                    yuicompress: true
                },
                files: {
                    "./assets/stylesheets/css/style.css": "./assets/stylesheets/less/style.less"
                }
            }
        },
        watch: {
            files: "./assets/stylesheets/less/*",
            tasks: ["less"]
        }
    });
    grunt.loadNpmTasks('grunt-contrib-less');
    grunt.loadNpmTasks('grunt-contrib-watch');
};
Run Code Online (Sandbox Code Playgroud)

  • 对于像我这样的新手,它可能有助于提到只运行`grunt`你需要定义默认任务,如`grunt.registerTask('default','watch');`供参考[docs](http:/ /gruntjs.com/api/grunt.task#grunt.task.registertask) (13认同)
  • @WillshawMedia只运行"开发"部分,使用`grunt less:development`.`grunt less`将在'less`下运行 (2认同)