PostCSS package and Meteor Build Plugin questions

packages
21

Thanks guys!

@juliancwirko can I add any valid postCSS plugin to the package.json ? Anyone working on a master list for these? I did find this: http://postcss.parts/

22

In theory yes, but many of the plugins may not work with Meteor. Of course I haven’t tested all.

But some of them works well. Here is the demo: https://github.com/juliancwirko/meteor-postcss-test where I use some of the plugins. You can test others and let me know if they work for you. There is even a demo of usage Stylelint which is also used as a PostCSS plugin: https://github.com/juliancwirko/meteor-stylelint-demo (article: https://medium.com/@juliancwirko/how-to-use-css-linter-in-meteor-c60b2f24f969)

So basically the package is prepared to support many PostCSS plugins, but because of specific Meteor build workflow some of them may not work properly.

1 Like
23

I also support registering PostCSS as a build tool “minifier”, but a problem that we have right now is that we don’t have a clean way to implement caching for these. That means that every time you touch a file, your minifier is going to be called for every CSS file again. And if you have to parse the file, run postCSS on the AST, and recompute a String for that again, it is going to slow down your reload time in a sensible way. Minifiers, like Compilers should implement some file level caching.

We discussed this issue as part of PR #5875.

3 Likes
24

Version 1.0.0-beta.1 for Meteor beta (also on Atmosphere):
https://github.com/juliancwirko/meteor-postcss/tree/meteor-1.3-in-progress.
Feedback is welcome.

1 Like
25

1).

$ meteor create --release 1.3-beta.11 myApp
$ cd myApp
$ meteor remove standard-minifier-css
$ meteor add juliancwirko:postcss@1.0.0-beta.11

2).

$ npm init
$ npm install autoprefixer --save-dev

3). Open just created package.json file
4). After devDependencies add:

"postcss": {
    "plugins": {
      "autoprefixer": {"browsers": ["last 2 versions"]}
    }
  }

5). You’ve just installed proper Autoprefixer (PostCSS plugin). And there is more: http://postcss.parts/ :wink: Also check out the new website: http://postcss.org/

3 Likes
26

New version for Meteor 1.3 has the possibility to configure PostCSS parsers.
Read more here: https://github.com/juliancwirko/meteor-postcss/tree/meteor-1.3-in-progress#postcss-parsers

Also take a look at: Meteor 1.3 Scss imports from node_modules experiment

3 Likes
27

There is version 1.0.0 for Meteor 1.3
https://atmospherejs.com/juliancwirko/postcss

Check out demo files: https://github.com/juliancwirko/meteor-postcss-test/tree/master/client
And demo package.json file configuration: https://github.com/juliancwirko/meteor-postcss-test/blob/master/package.json

This package also allows you to import .css files from node_modules and with a little more work you will be able to also import and compile .scss files. Take a look at: https://github.com/juliancwirko/meteor-bootstrap-postcss-test

1 Like
28

Version 1.1.0 with added possibility to exclude particular Meteor packages from the PostCSS processing. More info: https://github.com/juliancwirko/meteor-postcss#exclude-meteor-packages

29

I recommend:

“PostCSS with Ben Briggs” https://devchat.tv/js-jabber/206-jsj-postcss-with-ben-briggs