Update postcss to the latest version 🚀

greenkeeper[bot] commented 7 years ago

Version 6.0.0 of postcss just got published.

Dependency	postcss
Current Version	5.2.17
Type	dependency

The version 6.0.0 is not covered by your current version range.

Without accepting this pull request your project will work just like it did before. There might be a bunch of new features, fixes and perf improvements that the maintainers worked on for you though.

I recommend you look into these changes and try to get onto the latest version of postcss. Given that you have a decent test suite, a passing build is a strong indicator that you can take advantage of these changes by merging the proposed change into your project. Otherwise this branch is a great starting point for you to work on the update.

Release Notes

6.0 “Marquis Orias”

PostCSS 6.0 dropped Node.js 0.12 support, cleaned raws API, added @apply support and uses less memory.

Breaking Changes

Node.js stopped 0.12 support in January 01. So PostCSS dropped Node.js 0.12 from all tests. Please update your Node.js to 4.0 or 7.0 versions.

In 6.0 we fixed our mistakes in API design. First, if node already had a parent, insert methods (append, insertAfter, etc) will not clone it anymore. In 6.0 inserts methods will remove inserted node from previous parent:

parent1.nodes.length //=> 3
parent2.append(parent1.nodes[0])
parent1.nodes.length //=> 2

So, right now there are no needs to moveTo, moveAfter and moveBefore methods. Regular insert methods have move behavior. In this case, we deprecated move methods.

Also Node#clone now return the exactly copy of the node. In 6.0 it stops to clean raws.

node.raws.before //=> "\n  "
const clone = node.clone()
clone.raws.before //=> "\n  "

Every PostCSS plugin has plugin.process shortcut. In 6.0 we split process and plugin options in this shortcut:

const plugin = postcss.plugin('postcss-awesome', colors => {
  …
})
plugin.process(css, { from: 'app.css' }, colors).css

In the new major release, we finally remove all deprecated methods from PostCSS 4.0. It should not be a big problem because we show deprecated warnings for them for 2 years. Most of the plugins updated their API.

New Methods and Properties

Since we removed deprecated methods from PostCSS 4.0, in 6.0 we were free to add before() and after() shortcuts, similar to DOM API methods.

node1.before(node2)
// is equal too
node1.parent.insertBefore(node1, node2)

Chrome 51 started to support “native CSS mixins” from @tabatkins spec under the flag:

:root {
  --clearfix: {
    display: table;
    clear: both;
    content: '';
  };
}

.box:after{
  @apply --clearfix;
}

PostCSS 5.0 could parse it pretty well, but in some cases, it lost semicolon after mixin definition. In PostCSS 6.0 parser we covered this case, and node rules have Rule#raws.ownSemicolon for own semicolon.

Stream Parser

In PostCSS 5.0 tokenizing and parsing were separated steps. As a result, we put all tokens to memory between steps. It works well in most of the cases. But memory usage was pretty big when you try to parse really big CSS files (more than 25 MB).

In 6.0 @hzlmn rewrote parser, and now parser and tokenizer work together (stream parser). As a result, we put only a few latest tokens in memory. So 6.0 will use less memory.

Package Size

We care about node_modules size problem. So in 6.0 @lahmatiy and @h0tc0d3 removed js-base64 dependency to use native Node.js and Browsers ways to base64 encoding.

Also, PostCSS was moved to babel-preset-env. Instead of regular babel, it will compile only necessary parts of ES6. So build in npm packages will be cleaner. Current browserslist config for babel-preset-env is last 1 version and node 4.

Other Changes

Fix error message on single : in CSS.
Move tests to Jest.
Clean up test (by @gkal19).

Not sure how things should work exactly?

There is a collection of [frequently asked questions](https://greenkeeper.io/faq.html) and of course you may always [ask my humans](https://github.com/greenkeeperio/greenkeeper/issues/new).

Your Greenkeeper Bot :palm_tree:

greenkeeper[bot] commented 7 years ago

Ticketfly-UI / ember-css-composer