Stopp einige Auto mit CSS

Question

Ich habe folgendes SCSS in meiner _layout.scss Datei

.wrap { 
    display: flex; 
    flex-wrap: wrap; 
} 

und diese SCSS wird automatisch ersetzt mit folgenden CSS, aber ich will (display: -webkit-box;)

.wrap { 
    display: -webkit-box; 
    display: -webkit-flex; 
    display: -ms-flexbox; 
    display: flex; 
    -webkit-flex-wrap: wrap; 
    -ms-flex-wrap: wrap; 
    flex-wrap: wrap; 
} 

mehr zu verwenden ich meine, die CSS sagen sollte, wie unten

.wrap { 
    display: -webkit-flex; 
    display: -ms-flexbox; 
    display: flex; 
    -webkit-flex-wrap: wrap; 
    -ms-flex-wrap: wrap; 
    flex-wrap: wrap; 
} 

Answer 1

Aktualisieren Sie Ihre autoprefixer zu sehen. Ich nehme an, Sie benutzen Gulp oder Grunt?

Sie können auch diese Abhilfe verwenden:

var postcss = require('postcss'); 

module.exports = postcss.plugin('flexbox-cleaner', function() { 
    return function (css) { 
     css.walkAtRules('supports', function (rule) { 
      rule.params = rule.params.replace('((display: -webkit-flex) or (display: -ms-flexbox) or (display: flex))', '(display: flex)'); 
     }); 
    }; 
} 

dies ist ein postCSS Plugin und es lassen autoproefixer einige Flexbox Parameter ignorieren (wie Sie).

source