5.1 “Jianyuan”

Autoprefixer 5.1 has support for many new properties and at-rules and remove prefixes in values with higher accuracy.

New At-Rules

Now Autoprefixer adds prefixes for @viewport
and min-resolution/max-resolution query in CSS Media Queries:

@viewport {
    width: device-width;
}
@media  (min-resolution: 192dpi), (min-resolution: 2dppx) {
    background: url(image@2x.jpg);
}

↓

@-ms-viewport {
    width: device-width;
}
@-o-viewport {
    width: device-width;
}
@viewport {
    width: device-width;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
    background: url(image@2x.jpg);
}

Also new Autoprefixer doesn’t remove your code style while adding prefixes to @keyframes and @viewport.

New Properties

@yisibl find many new properties for Autoprefixer and helped to implement them:

a {
    text-emphasis: dot;
    image-rendering: crisp-edges;
    text-align-last: justify;
    text-overflow: ellipsis;
    margin-block-start: 10px;
    padding-inline-end: 10px;
}

↓

a {
    -webkit-text-emphasis: dot;
            text-emphasis: dot;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-crisp-edges;
    image-rendering: crisp-edges;
    -moz-text-align-last: justify;
         text-align-last: justify;
    -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    -webkit-margin-before: 10px;
            margin-block-start: 10px;
    -webkit-padding-end: 10px;
       -moz-padding-end: 10px;
            padding-inline-end: 10px;
}

Vendor Hacks in Values

Autoprefixer removes outdated prefixes. But it is smart and understand, when you use old prefix for vendor-specific hack like -webkit-transform: translateZ(0).

Unfortunately, previous Autoprefixer detected vendor hacks only in properties, but removed all old prefixes in values. Autoprefixer 5.1 became more attentive and doesn’t remove prefix if there is not unprefixed version around.

Browserslist 0.2

Autoprefixer 5.1 uses Browserslist 0.2. Can I Use joins some versions like ios_saf 7.0-7.1 and in Browserslist you can select this joinded versions only by latest version iOS 7.1.

@iamvdo found this lost versions and fix it. Now you can select ios_saf 7.0-7.1 by iOS 7.0 or even iOS 7.

Other Changes

• Return autoprefixer.defaults as alias to current browserslist.defaults.
• Fix -webkit-filter in transition.
• Fix compatibility with postcss-import (by @jasonkuhrt).
• Fix Flexbox prefixes for BlackBerry and UC Browser.
• Fix gradient prefixes for old Chrome.
• Add --no-remove option to CLI.

5.0 “Pravda vítězí”

Autoprefixer 5.0 uses PostCSS 4.0 and Browserslist.

Browserslist

Browserslist is a library to parse browsers queries like last 2 versions. It gives to Autoprefixer:

• More accurate usage statistics calculation.
• New > 5% in US query to select browsers by usage statistics in some country.
• Global browserslist config. It is used in many other tools like Autopolyfiller or doiuse. Now you have one place to storage supported browsers across different tools.

New Properties

With @yisibl help Autoprefixer 5.0 now adds -o- prefix for object-fit and object-position properties and -webkit- prefix for CSS Shapes properties.

Other Changes

• Fix UC Browser in debug info.
• Remove autoprefixer.defaults and use defaults from Browserslist.

4.0.2

• Remove o-border-radius, which is common mistake in legacy CSS.

4.0.1

• Fix @supports support with brackets in values (by @iamvdo).

4.0 “Indivisibiliter ac Inseparabiliter”

Autoprefixer 4.0 is based on PostCSS 3.0, so it become 2,5 times faster.

Sources Maps

PostCSS 3.0 sets map.inline and map.sourcesContent to true by default, since it is now the most popular way to use maps.

Previous source map is now used in more places. If you miss from option, PostCSS will take file name from file field in source map. If CSS contains syntax errors, PostCSS will show origin source of error even if you concatenate many files before Autoprefixer.

Also PostCSS 3.0 now supports Unicode BOM symbol in source maps and better works with sourceMappingURL annotation comment.

Cleaning

By default Autoprefixer removes outdated prefixes.

Now you can disable this behavior by remove: false option:

autoprefixer()
  .process('a { -webkit-border-radius: 2px; border-radius: 2px }');
// remove outdated -webkit-border-radius

autoprefixer({ remove: false })
  .process('a { -webkit-border-radius: 2px; border-radius: 2px }');
// keeps -webkit-border-radius

Other Changes

• Add box-decoration-break support.
• Do not add old -webkit- prefix for gradients with px units.
• Parse at-rules without spaces like @import"file".

3.1.2

• Update Firefox ESR version from 24 to 31.

3.1.1

• Use Flexbox 2009 spec for Android stock browser < 4.4.

3.1 “Satyameva Jayate”

- Do not remove comments from prefixed values (by @rousso1). - Allow Safari 6.1 to use final Flexbox spec (by @radium-v). - Fix `filter` value in `transition` in Webkits. - Show greetings if your browsers don’t require any prefixes. - Add `<=` and `<` browsers requirement (by @papandreou).

3.0.1

• Fix autoprefixer.postcss in callbacks.

3.0 “Liberté, Égalité, Fraternité”

Autoprefixer 3.0 changes browsers API, adds autoprefixer-core package and uses GNU style for syntax error messages.

API Changes

Method autoprefixer() had confused and too difficult options. @sindresorhus showed issue and @lydell suggested new API.

Now you will set browsers list in browsers key with other options:

autoprefixer({ browsers: ['> 5%', 'IE 7'], cascade: false }).process(css).css;

If you want to clean CSS from any prefixes you should set [] instead of deprecated none.

var cleaner = autoprefixer({ browsers: [] });

Old API was deprecated and prints warnings. It will be removed in 3.1 release.

Core Package

@MoOx and @jonathanong noticed, that autoprefixer package contained many unnecessary code for plugin like grunt-autoprefixer.

So Autoprefixer was split to autoprefixer and autoprefixer-core npm packages. CLI tool and all file system code and dependencies were moved from autoprefixer-core to autoprefixer.

Package autoprefixer provide same API as autoprefixer-core, but all plugin developers should use only autoprefixer-core.

GNU Style for Syntax Errors

Autoprefixer 3.0 uses new PostCSS 2.2. It uses GNU Coding Standards for syntax error messages:

a.css:2:1 Unexpected { in decls

CoffeeScript and other tools uses same format and some IDE can parse this format and open wrong line in editor.

ES6 Migration

To be more familiar to new developers PostCSS was rewritten from CoffeeScript to JS ES6. Now Autoprefixer starts to use more ES6.

Autoprefixer package now contains only ES6 code. Autoprefixer Core uses ES6 only in built tasks, but we want to rewrite it completely.

Maybe you want to help us in ES6 migration? Work is very easy, but it will be routine. This help will makes you one of the biggest contributor (because you will changes many files :) ). Write me and I will send you instructions.

PostCSS Organization

Autoprefixer and Autoprefixer Core repositories was moved to PostCSS organization to be with other official PostCSS plugins.