grunt-contrib-cssmin
использует clean-css
для внутренних целей, как указано в options, а любые нативные (clean-css
) опции "передаются в clean-css".
clean-css
для удобства группирует оптимизацию по уровням. Существует два варианта управления удалением правил, оба находятся на уровне 2:
restructureRules: false, // should disable all removals
skipProperties: [] // specify individual rules to skip
Это должно сделать это:
cssmin: {
options: {
skipProperties: ['r']
}
}
забастовка>
Начиная с clean-css 4.2.0 a " Комментарий" для полного пропуска фрагментов будет доступен:
/* clean-css ignore:start */
.testClass {
r: 4;
width: 3px;
margin-left: 18px !important;
}
/* clean-css ignore:end */
Примечание 4.2
еще не выпущено.
После небольшого тестирования оказалось, что ничего из вышеперечисленного на самом деле не работает, хотя, согласно документации, оно "должно".
Единственная альтернатива, которая у меня есть, это заменить grunt-contrib-cssmin
на grunt-postcss cssnano
(именно это я использовать с ворчанием для минификации):
npm install grunt-postcss cssnano
grunt.initConfig({
postcss: {
processors: [
require('cssnano')({
// options here...
})
]
},
});
grunt.loadNpmTasks('grunt-postcss');
grunt.registerTask('postcss', ["postcss"]);
На практике я использую больше надстроек postcss
.
Вот практический пример с autoprefixer
, pixrem
, postcss-flexbox
и cssnano
:
module.exports = function(grunt) {
grunt.initConfig({
postcss: {
options: {
processors: [
require('pixrem'),
require('autoprefixer')({browsers: ['> 0%']}),
require('postcss-flexboxfixer'),
require('cssnano')({
autoprefixer:false,
zindex: false
})
]
},
jack: {
files: [{
expand:true,
flatten:true,
cwd: 'assets/',
src: ['scss/*.css', '!**/variables.css'],
dest:'assets/css/'
}]
}
},
watch: {
styles: {
files: [
'assets/scss/*.css'
],
tasks:['postcss:jack']
}
}
});
grunt.loadNpmTasks('grunt-postcss');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.registerTask('default', ["watch:styles"]);
grunt.registerTask('jack', ["postcss:jack"]);
};
Я специально зарегистрировал задачу, которая запускает только плагин postcss
:
grunt jack
Не забывайте, что вам нужно установить каждый аддон для использования с postcss
. Для вышеперечисленного вам понадобятся:
npm install grunt-postcss cssnano pixrem autoprefixer postcss-flexboxfixer
... и, скорее всего, вы захотите изменить files
, чтобы он соответствовал тому, что у вас есть.
На этот раз я протестировал. Свойство r
помещается в минифицированный файл:
.testClass{r:20;width:3px;margin-left:18px!important}
person
tao
schedule
01.07.2017