如何禁用grunt-contrib-cssmin组合？

Question

I have three files:

'selectize.default.css'
'selectize.pagination.css'
'selectize.patch.css'

and I want to minimize them.

Here is my gruntfile:

cssmin: {
     min: {
         files: [{
             expand: true,
             cwd: 'css',
             src: [
               'selectize.default.css',
               'selectize.pagination.css',
               'selectize.patch.css',
               '!*.min.css'
             ],
             dest: 'release/css',
             ext: '.min.css'
         }]
     }
}

Problem is there is only one file named selectize.min.css I don't want it to minimize only one file. How can I minimize all three of them?

Answer 1

So this ticket is kind of old, but as Peng Lin so eloquently stated above, the selected answer is inadequate for most programmers since it requires too much manual adjustment. It's not maintainable.

Grunt has a way of specifying where the extension dot is in file names. By default, it's set to the first one which effectively changes the file names on output. The property is called extDot. You can read about it Here if you want.

If you set it to last , it will preserve your file names and your original example will work.

Example:

cssmin: {
  min: {
     files: [{
         expand: true,
         cwd: 'css',
         src: [
           'selectize.default.css',
           'selectize.pagination.css',
           'selectize.patch.css',
           '!*.min.css'
         ],
         dest: 'release/css',
         ext: '.min.css',
         extDot: 'last'   // Extensions in filenames begin after the last dot
     }]
 }  }

Hope this helps someone in the future.

Answer 2

If I understand your question correctly, you want to minimize the files, but not combine them into one? In that case, my recommendation would be to make separate calls for each file. eg:

cssmin: {
     default: {
         files: [{
             expand: true,
             cwd: 'css',
             src: [
               'selectize.default.css',
             ],
             dest: 'release/css',
             ext: '.min.css'
         }]
     },
     pagination: {
         files: [{
             expand: true,
             cwd: 'css',
             src: [
               'selectize.pagination.css',
             ],
             dest: 'release/css',
             ext: '.min.css'
         }]
     },
     patch: {
         files: [{
             expand: true,
             cwd: 'css',
             src: [
               'selectize.patch.css',
             ],
             dest: 'release/css',
             ext: '.min.css'
         }]
     },
 }

It probably isn't the cleanest way, but it will do what you want. I haven't test this code, so be warned I don't know that it works.