-
Notifications
You must be signed in to change notification settings - Fork 0
/
package.json
53 lines (53 loc) · 12.4 KB
/
package.json
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
{
"name": "autoprefixer",
"version": "0.8.20131213",
"description": "Parse CSS and add vendor prefixes to CSS rules using values from the Can I Use website",
"keywords": [
"css",
"prefix",
"rework"
],
"author": {
"name": "Andrey Sitnik",
"email": "andrey@sitnik.ru"
},
"license": "LGPL 3",
"repository": {
"type": "git",
"url": "https://github.com/ai/autoprefixer.git"
},
"dependencies": {
"css-parse": "~> 1.6.0",
"css-stringify": "~> 1.4.1"
},
"devDependencies": {
"coffee-script": "1.6.3",
"component": "0.18.0",
"fs-extra": "0.8.1",
"should": "2.1.1",
"stylus": "0.41.3",
"rework": "0.18.3",
"mocha": "1.15.1",
"glob": "3.2.7",
"nib": "1.0.1"
},
"bin": {
"autoprefixer": "./bin/autoprefixer"
},
"main": "lib/autoprefixer",
"scripts": {
"test": "mocha"
},
"readme": "# Autoprefixer\n\n<img align=\"right\" width=\"94\" src=\"http://ai.github.io/autoprefixer/logo.svg\" title=\"Autoprefixer logo by Anton Lovchikov\">\n\nParse CSS and add vendor prefixes to CSS rules using values\nfrom the [Can I Use](http://caniuse.com/).\n\nWrite your CSS rules without vendor prefixes (in fact, forget about them\nentirely):\n\n```css\n:fullscreen a {\n transition: transform 1s\n}\n```\n\nProcess your CSS by Autoprefixer:\n\n```js\nvar prefixed = autoprefixer.compile(css);\n```\n\nIt will use the data on current browser popularity and properties support\nto apply prefixes for you:\n\n```css\n:-webkit-full-screen a {\n -webkit-transition: -webkit-transform 1s;\n transition: transform 1s;\n}\n\n:-moz-full-screen a {\n transition: transform 1s;\n}\n\n:fullscreen a {\n -webkit-transition: -webkit-transform 1s;\n transition: transform 1s;\n}\n```\n\nTwitter account for news and releases:\n[@autoprefixer](https://twitter.com/autoprefixer).\n\nSponsored by [Evil Martians](http://evilmartians.com/).\n\n## Translations\n\nНа русском: [статья про Автопрефиксер на Хабрахабре](http://habrahabr.ru/company/evilmartians/blog/176909/)\n\n## Features\n\n### Forget about prefixes\n\nThe best tool is a tool you can't see and one that does the work for you.\nThis is the main idea behind Autoprefixer.\n\nAutoprefixer interface is simple: just forget about vendor prefixes\nand write normal CSS according to latest W3C specs. You don’t need\na special language (like Sass) or special mixins.\n\nBecause Autoprefixer is a postprocessor for CSS,\nyou can also use it with preprocessors, such as Sass, Stylus or LESS.\n\n### Actual data from Can I Use\n\nAutoprefixer uses the most recent data from [Can I Use](http://caniuse.com/),\nunderstands which browsers are actual and popular and adds only the necessary\nvendor prefixes.\n\nIt also cleans your CSS from old prefixes (like prefixed `border-radius`,\nproduced by many CSS libraries):\n\n```css\na {\n -webkit-border-radius: 5px;\n border-radius: 5px\n}\n```\n\ncompiles to:\n\n```css\na {\n border-radius: 5px\n}\n```\n\n### Rewrite syntax\n\nFlexbox or gradients have different syntaxes in different browsers\n(sometimes you need to recalculate angles, sometimes you need 2 old properties\ninstead of new one), but Autoprefixer hides this from you.\n\nJust code by latest W3C specs and Autoprefixer will produce the code\nfor old browsers:\n\n```css\na {\n display: flex;\n}\n```\n\ncompiles to:\n\n```css\na {\n display: -webkit-box;\n display: -webkit-flex;\n display: -moz-box;\n display: -ms-flexbox;\n display: flex\n}\n```\n\n### Fast\n\nAutoprefixer is about 16 times faster than Compass and 8 times faster\nthan Stylus.\n\nOn a Core i7 with 10 GB of RAM and SSD, benchmark with GitHub styles is:\n\n```\n~/Dev/autoprefixer$ ./node_modules/.bin/cake bench\nLoad GitHub styles\nAutoprefixer: 316 ms\nCompass: 5342 ms (16.9 times slower)\nRework: 249 ms (1.3 times faster)\nStylus: 2548 ms (8.1 times slower)\n```\n\nUnlike [-prefix-free](http://leaverou.github.io/prefixfree/), Autoprefixer\ncompiles CSS once on deploy and doesn’t hit client-side performance.\n\n## Browsers\n\nYou can specify the browsers you want to target in your project:\n\n```js\nautoprefixer(\"last 1 version\", \"> 1%\", \"ie 8\", \"ie 7\").compile(css);\n```\n\n* `last n versions` is last versions for each browser. Like “last 2 versions”\n [strategy](http://support.google.com/a/bin/answer.py?answer=33864) in\n Google.\n* `> n%` is browser versions, selected by global usage statistics.\n* `ff > 20` and `ff >= 20` is Firefox versions newer, that 20.\n* `none` don’t set any browsers to clean CSS from any vendor prefixes.\n* You can also set browsers directly.\n\nBlackberry and stock Android browsers will not be used in `last n versions`.\nYou can add them by name:\n\n```js\nautoprefixer(\"last 1 version\", \"bb 10\", \"android 4\").compile(css);\n```\n\nYou can find the browsers codenames in [data file](data/browsers.coffee):\n* `android` for old Android stock browser.\n* `bb` for Blackberry browser.\n* `chrome` for Google Chrome.\n* `ff` for Mozilla Firefox.\n* `ie` for Internet Explorer.\n* `ios` for iOS Safari.\n* `opera` for Opera.\n* `safari` for desktop Safari.\n\nBy default, Autoprefixer uses `> 1%, last 2 versions, ff 24, opera 12.1`:\n* Firefox 24 is a latest [ESR].\n* Opera 12.1 will be in list until Opera supports non-Blink 12.x branch.\n\n[ESR]: http://www.mozilla.org/en/firefox/organizations/faq/\n\n## Inspect\n\nYou can check which browsers are selected and which properties will be prefixed:\n\n```js\ninspect = autoprefixer(\"last 1 version\").inspect();\nconsole.log(inspect);\n```\n\nOr by CLI command:\n\n```sh\nautoprefixer -i\n```\n\n## FAQ\n\n### Does it add polyfills for old browsers?\n\nNo. Autoprefixer only adds prefixes, not polyfills. There are two reasons:\n\n1. Prefixes and polyfills are very different and need a different API.\n Two separate libraries would be much better.\n2. Most of IE polyfills are very bad for client perfomance. They use slow hacks\n and old IEs is mostly used on old hardware. Most of CSS 3 features that is\n only used for styling should be ignored in old IEs as it is recommended in\n Graceful Degradation.\n\n### Why doesn’t Autoprefixer do anything?\n\nDevelopers are often surprised by how few prefixes are required today.\nIf Autoprefixer doesn’t add prefixes to your CSS, check if they’re still\nrequired on [Can I Use](http://caniuse.com/).\n\nIf a prefix is required, but Autoprefixer doesn’t add it or adds it\nincorrectly, please\n[report an issue](https://github.com/ai/autoprefixer/issues/new)\nand include your source CSS and expected output.\n\n### Does it support source maps?\n\nUnfortunately, right now Autoprefixer doesn’t support source maps.\nHowever, this feature will be included in the next version, 1.0, which is\ncurrently [under development](https://github.com/ai/autoprefixer/tree/v1.0)\nand is planned for release in mid-December 2013.\n\nRight now you can use lydell’s fork with source map support:\n[lydell/autoprefixer](https://github.com/lydell/autoprefixer/tree/source-maps#nodejs).\n\nYou can check the current status of this feature in\n[autoprefixer#37](https://github.com/ai/autoprefixer/issues/37).\n\n### Why Autoprefixer plugin for text editor changed my indents?\n\n[Rework](https://github.com/visionmedia/rework), which Autoprefixer currently\nuses for parsing CSS, doesn’t save indents, because it was created for Grunt\nand other build tools.\n\nIn version 1.0 Autoprefixer will switch to the\n[PostCSS](https://github.com/ai/postcss) parser, which preserves formatting\nof the code.\n\n## Usage\n\n### Ruby on Rails\n\nAdd [autoprefixer-rails](https://github.com/ai/autoprefixer-rails) gem\nto `Gemfile` and write CSS in a usual way:\n\n```ruby\ngem \"autoprefixer-rails\"\n```\n\n### Middleman\n\nAdd [middleman-autoprefixer](https://github.com/porada/middleman-autoprefixer)\ngem to `Gemfile`:\n\n```ruby\ngem \"middleman-autoprefixer\"\n```\n\nand activate the extension in your project’s `config.rb`:\n\n```ruby\nactivate :autoprefixer\n```\n\n### Ruby\n\nYou can integrate Autoprefixer into your Sprockets environment\nby `autoprefixer-rails` gem:\n\n```ruby\nAutoprefixerRails.install(sprockets_env)\n```\n\nor process CSS from plain Ruby:\n\n```ruby\nprefixed = AutoprefixerRails.compile(css)\n```\n\n### Grunt\n\nYou can use the\n[grunt-autoprefixer](https://github.com/nDmitry/grunt-autoprefixer)\nplugin for Grunt. Install the npm package and add it to Gruntfile:\n\n```js\ngrunt.loadNpmTasks('grunt-autoprefixer');\n```\n\nIf you use Sass with `compress` output style and worry that Autoprefixer might\nuncompress CSS, try [grunt-csso](https://github.com/t32k/grunt-csso).\nIt will compress the CSS back, but does the compression much better than Sass.\n\n### Prepros\n\nIf you want to build your assets in GUI, try\n[Prepros](http://alphapixels.com/prepros/). Just set “Auto Prefix CSS”\n[checkbox](https://f.cloud.github.com/assets/3478693/930798/faa29892-0016-11e3-8901-87850de7aed2.jpg)\nin right panel.\n\n### Compass\n\nIf you use Compass binary to compile your styles, you can easily integrate\nAutoprefixer with it. Install `autoprefixer-rails` gem:\n\n```\ngem install autoprefixer-rails csso-rails\n```\n\nand add post-compile hook to `config.rb`:\n\n```ruby\nrequire 'autoprefixer-rails'\nrequire 'csso'\n\non_stylesheet_saved do |file|\n css = File.read(file)\n File.open(file, 'w') do |io|\n io << Csso.optimize( AutoprefixerRails.compile(css) )\n end\nend\n```\n\nIf you use `compress` output style, Autoprefixer will uncompress CSS.\nFor this reason, we use [csso-rails](https://github.com/Vasfed/csso-rails)\nto compress CSS back (it compress much better than Sass).\n\nIf you need uncompressed CSS, remove `Csso.optimize` method call.\n\nYou can set browsers array as second argument in `AutoprefixerRails.compile`.\n\n### Stylus\n\nIf you use Stylus CLI, you can add Autoprefixer by\n[autoprefixer-stylus](https://github.com/jenius/autoprefixer-stylus) plugin.\n\nJust install npm package and use it in `-u` option:\n\n```\nstylus -u autoprefixer-stylus file.css\n```\n\n### Mincer\n\nTo use Autoprefixer in [Mincer](https://github.com/nodeca/mincer),\ninstall `autoprefixer` npm package and enable it:\n\n```js\nenvironment.enable('autoprefixer');\n```\n\n### Node.js\n\nUse `autoprefixer` npm package:\n\n```js\nvar autoprefixer = require('autoprefixer');\nvar prefixed = autoprefixer.compile(css);\n```\n\n### JavaScript\n\nYou can use Autoprefixer in the browser or a non-Node.js runtime\nwith [standalone version](https://raw.github.com/ai/autoprefixer-rails/master/vendor/autoprefixer.js).\n\n### Rework\n\nAutoprefixer can be also used as a\n[Rework](https://github.com/visionmedia/rework)\nfilter, so you can combine it with other filters:\n\n```js\nrework(css).\n use( autoprefixer(['> 1%', 'opera 12.5']).rework ).\n use( rework.references() ).\n toString();\n```\n\n### PHP\n\nYou can use Autoprefixer in PHP by\n[autoprefixer-php](https://github.com/vladkens/autoprefixer-php) library:\n\n\n```php\n$autoprefixer = new Autoprefixer();\n$css = 'a { transition: transform 1s }';\n$prefixed = $autoprefixer->compile($css);\n```\n\n### Sublime Text\n\nYou can process your styles directly in Sublime Text with the\n[sublime-autoprefixer](https://github.com/sindresorhus/sublime-autoprefixer)\nplugin.\n\n\n### Others\n\nYou can use the `autoprefixer` binary to process CSS files using\nany assets manager:\n\n```\nsudo npm install --global autoprefixer\nautoprefixer *.css\n```\n\nSee `autoprefixer -h` for help.\n\n## In-package Update\n\nIt’s highly recommended that you always use the latest version of Autoprefixer.\nIf by any chance you or your company are not able to update the package\n(e.g. in case of long test periods before any library updates), you can still\nupdate the very browser data that Autoprefixer fetches from Can I Use:\n\n```\nautoprefixer --update\n```\n\nNote that the in-package update doesn’t get any code fixes nor the\nimplementation of new features. It just keeps the browser popularity and\nsupport data up to date, and adds new browser versions.\n",
"readmeFilename": "README.md",
"bugs": {
"url": "https://github.com/ai/autoprefixer/issues"
},
"homepage": "https://github.com/ai/autoprefixer",
"_id": "autoprefixer@0.8.20131213",
"dist": {
"shasum": "675ec908f333fceaf5ff646bc7dda0b1461b3a4f"
},
"_from": "autoprefixer@~0.8.20131209",
"_resolved": "http://registry.npmjs.org/autoprefixer/-/autoprefixer-0.8.20131213.tgz"
}