如何設置一個壓縮文件來壓縮只有一個CSS文件

Question

我正在使用Grunt和grunt-contrib-less將LESS文件編譯爲CSS。項目有兩個CSS文件，但我想要只有其中之一是縮小器。當我設置「compress」時，上面的文件受到了註釋。

你能幫我配置Gruntfile.js嗎？

我Gruntfile.js

'use strict'; 
module.exports = function(grunt) { 

    grunt.initConfig({ 
     less: { 
     dist: { 
      files: { 
       'assets/css/main.min.css': [ // THIS FILE I WANT TO COMPRESS 
        'assets/less/app.less' 
       ], 
       'assets/css/style.css': [ // THIS FILE I DO NOT WANT TO COMPRESS 
        'assets/less/style.less' 
       ] 
      }, 
      options: { 
       compress: false 
      } 
     } 
     }, 
    }); 

    // Load tasks 
    grunt.loadNpmTasks('grunt-contrib-less'); 

    // Register tasks 
    grunt.registerTask('default', [ 
     'less' 
    ]); 
}; 

Answer 1

我認爲你必須創建兩個單獨的任務。事情是這樣的：

'use strict'; 
module.exports = function(grunt) { 

    grunt.initConfig({ 
     less: { 
     one: { 
      files: { 
       'assets/css/main.min.css': [ // THIS FILE I WANT TO COMPRESS 
        'assets/less/app.less' 
       ] 
      }, 
      options: { 
       compress: true 
      } 
     }, 
     two: { 
      files: { 
       'assets/css/style.css': [ // THIS FILE I DO NOT WANT TO COMPRESS 
        'assets/less/style.less' 
       ] 
      }, 
      options: { 
       compress: false 
      } 
     } 
     }, 
    }); 

    // Load tasks 
    grunt.loadNpmTasks('grunt-contrib-less'); 

    // Register tasks 
    grunt.registerTask('default', [ 
     'less' 
    ]); 
};

更多信息：http://gruntjs.com/configuring-tasks

編輯：

你需要這樣的事情，那麼：

'use strict'; 
module.exports = function(grunt) { 

    grunt.initConfig({ 
     less: { 
     one: { 
      files: { 
       'assets/css/main.min.css': [ // THIS FILE I WANT TO COMPRESS 
        'assets/less/app.less' 
       ] 
      }, 
      options: { 
       compress: true 
      } 
     }, 
     two: { 
      files: { 
       'assets/css/style.css': [ // THIS FILE I DO NOT WANT TO COMPRESS 
        'assets/less/style.less' 
       ] 
      }, 
      options: { 
       compress: false 
      } 
     }, 
     three: { 
      files: { 
       'assets/css/main.min.css': [ // THIS FILE I WANT TO COMPRESS 
        'assets/less/app.less' 
       ] 
      }, 
      options: { 
       compress: true 
      } 
     }, 
     four: { 
      files: { 
       'assets/css/style.css': [ // THIS FILE I DO NOT WANT TO COMPRESS 
        'assets/less/style.less' 
       ] 
      }, 
      options: { 
       compress: false 
      } 
     } 
     }, 
    }); 

    // Load tasks 
    grunt.loadNpmTasks('grunt-contrib-less'); 

    // Register tasks 
    grunt.registerTask('production', ['one', 'two']); 
    grunt.registerTask('development', ['three', 'four']); 
};