autoprefixer 8.6.4 → 8.6.5

package/CHANGELOG.md

@@ -1,6 +1,9 @@
 # Change Log
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## 8.6.5
+* Do not show Grid warnings if IE was not selected.
+
 ## 8.6.4
 * Fix `stretch` prefix in Chrome >= 46.
 

package/README.md

@@ -50,48 +50,6 @@ Twitter account for news and releases: [@autoprefixer].
 [cult]:             http://cultofmartians.com/tasks/autoprefixer-grid.html
 
 
-## Features
-
-### Write Pure CSS
-
-Working with Autoprefixer is simple: just forget about vendor prefixes
-and write normal CSS according to the latest W3C specs. You don’t need
-a special language (like Sass) or remember where you must use mixins.
-
-Autoprefixer supports selectors (like `:fullscreen` and `::selection`),
-unit function (`calc()`), at‑rules (`@supports` and `@keyframes`)
-and properties.
-
-Because Autoprefixer is a postprocessor for CSS,
-you can also use it with preprocessors such as Sass, Stylus or LESS.
-
-
-### Only Actual Prefixes
-
-Autoprefixer utilizes the most recent data from [Can I Use]
-to add only necessary vendor prefixes.
-
-It also removes old, unnecessary prefixes from your CSS
-(like `border-radius` prefixes, produced by many CSS libraries).
-
-```css
-a {
-    -webkit-border-radius: 5px;
-            border-radius: 5px;
-}
-```
-
-compiles to:
-
-```css
-a {
-    border-radius: 5px;
-}
-```
-
-[Can I Use]: http://caniuse.com/
-
-
 ## Browsers
 
 Autoprefixer uses [Browserslist], so you can specify the browsers
@@ -115,34 +73,59 @@ and default value.
 [Stylelint]:         http://stylelint.io/
 
 
-## Outdated Prefixes
+## FAQ
 
-By default, Autoprefixer also removes outdated prefixes.
+#### Does Autoprefixer polyfill Grid Layout for IE?
 
-You can disable this behavior with the `remove: false` option. If you have
-no legacy code, this option will make Autoprefixer about 10% faster.
+Autoprefixer can be used to use Grid Layout for IE 10 and IE 11.
+But this polyfill will not work in 100 % cases.
+This is why it is disabled by default.
 
-Also, you can set the `add: false` option. Autoprefixer will only clean outdated
-prefixes, but will not add any new prefixes.
+First, you need to enable Grid prefixes by `grid: true` option.
 
-Autoprefixer adds new prefixes between any unprefixed properties and already
-written prefixes in your CSS. If it will break the expected prefixes order,
-you can clean all prefixes from your CSS and then
-add the necessary prefixes again:
+Second, you need to test every fix with Grid in IE. It is not,
+enable and forget featur. But it is still very useful.
+Financial Times and Yandex use it in production.
 
-```js
-var cleaner  = postcss([ autoprefixer({ add: false, browsers: [] }) ]);
-var prefixer = postcss([ autoprefixer ]);
+Third, there is not auto placement and all grid cell position must be set
+explicitly. However, Autoprefixer can covert even `grid-template`
+and `grid-gap` (but only when they are together).
 
-cleaner.process(css).then(function (cleaned) {
-    return prefixer.process(cleaned.css);
-}).then(function (result) {
-    console.log(result.css);
-});
+```css
+.page {
+    display: grid;
+    grid-gap: 33px;
+    grid-template:
+        "head head  head" 1fr
+        "nav  main  main" minmax(100px, 1fr)
+        "nav  foot  foot" 2fr /
+        1fr   100px 1fr;
+}
+.page__head {
+    grid-area: head;
+}
+.page__nav {
+    grid-area: nav;
+}
+.page__main {
+    grid-area: main;
+}
+.page__footer {
+    grid-area: foot;
+}
 ```
 
+See also:
 
-## FAQ
+* [The guide about Grids in IE and Autoprefixer].
+* [`postcss-gap-properties`] to use new `gap` property
+  instead of old `grid-gap`.
+* [`postcss-grid-kiss`] has alternate “everything in one property” syntax,
+  which make using Autoprefixer’s Grid safer.
+
+[The guide about Grids in IE and Autoprefixer]: https://css-tricks.com/css-grid-in-ie-css-grid-and-the-new-autoprefixer/
+[`postcss-gap-properties`]:                     https://github.com/jonathantneal/postcss-gap-properties
+[`postcss-grid-kiss`]:                          https://github.com/sylvainpolletvillard/postcss-grid-kiss
 
 #### No prefixes in production
 
@@ -549,13 +532,6 @@ You can also use comments recursively:
 }
 ```
 
-In Sass/SCSS/Less you can use all the disable options above, add an exclamation mark
-in the start of comment:
-
-```scss
-/*! autoprefixer: off */
-```
-
 
 ## Options
 

package/lib/processor.js

@@ -83,7 +83,8 @@ var Processor = function () {
                     result.warn('You should use 2 values for text-emphasis-position ' + 'For example, `under left` instead of just `under`.', { node: decl });
                 }
             } else {
-                if (_this.prefixes.options.grid) {
+                var grid = _this.prefixes.add['grid-area'];
+                if (_this.prefixes.options.grid && grid && grid.prefixes) {
                     if (prop === 'grid-auto-columns') {
                         result.warn('grid-auto-columns is not supported by IE', { node: decl });
                         return undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "autoprefixer",
-  "version": "8.6.4",
+  "version": "8.6.5",
   "description": "Parse CSS and add vendor prefixes to CSS rules using values from the Can I Use website",
   "keywords": ["autoprefixer", "css", "prefix", "postcss", "postcss-plugin"],
   "author": "Andrey Sitnik <andrey@sitnik.ru>",
@@ -8,7 +8,7 @@
   "repository": "postcss/autoprefixer",
   "dependencies": {
     "browserslist": "^3.2.8",
-    "caniuse-lite": "^1.0.30000859",
+    "caniuse-lite": "^1.0.30000864",
     "normalize-range": "^0.1.2",
     "num2fraction": "^1.2.2",
     "postcss": "^6.0.23",