Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update postcss to the latest version 🚀 #2548

Closed
wants to merge 1 commit into from

Conversation

greenkeeper[bot]
Copy link
Contributor

@greenkeeper greenkeeper bot commented May 6, 2017

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”

Marquis Orias seal

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 and of course you may always ask my humans.


Your Greenkeeper Bot 🌴

@alexander-akait
Copy link
Member

@stylelint/core I think we should do this to version 8

@hudochenkov
Copy link
Member

@evilebottnawi agree. By the time we are ready for v8, there would be bug fixes for PostCSS 6. And it's good :)

@alexander-akait alexander-akait added the status: blocked is blocked by another issue or pr label May 6, 2017
@alexander-akait alexander-akait added this to the 8.0.0 milestone May 6, 2017
greenkeeper bot added a commit that referenced this pull request May 7, 2017
@greenkeeper
Copy link
Contributor Author

greenkeeper bot commented May 7, 2017

Version 6.0.1 just got published.

Update to this version instead 🚀

@jeddy3
Copy link
Member

jeddy3 commented May 8, 2017

I think we should do this to version 8

Sounds good. Let's close this PR and open another that points to v8.

@ntwb ntwb changed the base branch from master to v8 May 8, 2017 23:14
@ntwb ntwb changed the base branch from v8 to master May 8, 2017 23:14
@ntwb ntwb mentioned this pull request May 8, 2017
@ntwb
Copy link
Member

ntwb commented May 8, 2017

Sounds good. Let's close this PR and open another that points to v8.

Done in #2561

@ntwb ntwb closed this May 8, 2017
@ntwb ntwb deleted the greenkeeper/postcss-6.0.0 branch May 8, 2017 23:20
@ntwb ntwb added resolution: duplicate and removed PR: review needed status: blocked is blocked by another issue or pr labels May 10, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants