{
  "name": "autoprefixer",
  "version": "1.1.20140605",
  "description": "Parse CSS and add vendor prefixes to CSS rules using values from the Can I Use website",
  "keywords": [
    "css",
    "prefix",
    "postprocessor",
    "postcss"
  ],
  "author": {
    "name": "Andrey Sitnik",
    "email": "andrey@sitnik.ru"
  },
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": "https://github.com/ai/autoprefixer.git"
  },
  "dependencies": {
    "postcss": "~0.3.5",
    "fs-extra": "~0.9.1"
  },
  "devDependencies": {
    "coffee-script": "1.7.1",
    "browserify": "4.1.8",
    "should": "4.0.1",
    "stylus": "0.46.2",
    "mocha": "1.20.1",
    "nib": "1.0.2"
  },
  "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 [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.process(css).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:-moz-full-screen a {\n    transition: transform 1s\n}\n:-ms-fullscreen a {\n    transition: transform 1s\n}\n:fullscreen a {\n    -webkit-transition: -webkit-transform 1s;\n    transition: transform 1s\n}\n```\n\nYou can play with your CSS in the [interactive demo] of Autoprefixer.\n\nTwitter account for news and releases: [@autoprefixer].\n\nSponsored by [Evil Martians]. Based on [PostCSS] framework.\n\n[interactive demo]: http://jsfiddle.net/simevidas/udyTs/show/light/\n[@autoprefixer]:    https://twitter.com/autoprefixer\n[Evil Martians]:    http://evilmartians.com/\n[PostCSS]:          https://github.com/ai/postcss\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 the 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\nNote, that Autoprefixer doesn’t load Can I Use data every time. This data\nis already packed in the release, so the same Autoprefixer version will always\nhave same output.\n\n### Flexbox, Gradients, etc.\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\nAutoprefixer has [22 special hacks] to fix browser’s differences.\n\n[22 special hacks]: https://github.com/ai/autoprefixer/tree/master/lib/hacks\n\n### Fast\n\nAutoprefixer is about several times faster than Compass and 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: 466 ms\nCompass:      2828 ms (6.1 times slower)\nStylus:       1491 ms (3.2 times slower)\n```\n\nUnlike [-prefix-free](http://leaverou.github.io/prefixfree/), Autoprefixer\ncompiles CSS once on deploy and doesn’t hurt 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%\", \"Explorer 7\").process(css).css;\n```\n\n* `last 2 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* `last 2 Chrome versions` is last versions of the specified browser.\n* `> 5%` is browser versions, selected by global usage statistics.\n* `Firefox > 20` is Firefox versions newer than 20.\n* `Firefox >= 20` is Firefox version 20 or newer.\n* `Firefox ESR` is the latest [Firefox ESR] version.\n* `none` don’t set any browsers to clean CSS from any vendor prefixes.\n* `ios 7` to set browser version 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\", \"BlackBerry 10\", \"Android 4\").process(css).css;\n```\n\nBrowsers names (case insensitive):\n* `Android` for old Android stock browser.\n* `BlackBerry` or `bb` for Blackberry browser.\n* `Chrome` for Google Chrome.\n* `Firefox` or `ff` for Mozilla Firefox.\n* `Explorer` or `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, Firefox ESR, Opera 12.1`:\n* Latest [Firefox ESR] is a 24 version.\n* Opera 12.1 will be in list until Opera supports non-Blink 12.x branch.\n\n[Firefox ESR]: http://www.mozilla.org/en/firefox/organizations/faq/\n\n## Source Map\n\nYou must set input and output CSS files paths (by `from` and `to` options)\nto generate a correct map.\n\nAutoprefixer can modify previous source maps (for example, from Sass):\nit will autodetect a previous map if it is listed in an annotation comment or\nin a file near the input CSS. You can disable source map with `map: false` or\nset the previous source map content manually to `map` option (as a string or a\nJS object).\n\n```js\nvar result = autoprefixer.process(css, {\n    map:   fs.readFileSync('main.sass.css.map'),\n    from: 'main.sass.css',\n    to:   'main.min.css'\n});\n\nresult.css //=> CSS with source map annotation comment\nresult.map //=> Source map from main.sass to main.min.css\n\nfs.writeFileSync('main.min.css.map', result.map);\n```\n\nAutoprefixer supports inline source maps too. If input CSS contains annotation\nfrom the previous step with map in `data:uri`, Autoprefixer will update the\nsource map with prefixes changes and inine the new map back into the output CSS.\n\nYou can read more about source map options in\n[PostCSS documentation](https://github.com/ai/postcss#source-map-1).\n\n## Visual Cascade\n\nAutoprefixer can change CSS indentation to create a nice visual cascade\nof prefixes. You need to send `cascade: true` option to processor constructor:\n\n```js\nautoprefixer(\"> 1 %\", \"last 2 version\", { cascade: true }).process(css).css\n```\n\nand, if CSS will be uncompressed, output would be like:\n\n```css\na {\n    -webkit-box-sizing: border-box;\n       -moz-box-sizing: border-box;\n            box-sizing: border-box\n}\n```\n\n## Debug\n\nYou can check which browsers are selected and which properties will be prefixed:\n\n```js\ninfo = autoprefixer(\"last 1 version\").info();\nconsole.log(info);\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 CSS3 features used only\n   for styling should be ignored in old IEs as is recommended for\n   Graceful Degradation.\n\n### Why don’t gradients work in Firefox?\n\nCheck that you use correct [direction syntax]. For example, you should use\n`to bottom` instead of `top`:\n\n```css\na {\n  background: linear-gradient(to bottom, white, black)\n}\n```\n\nUnfortunately, unprefixed gradients use a different direction syntax and most\nexamples you find use an old gradient syntax, so be careful and use always the\nlatest W3C specs with Autoprefixer.\n\n[direction syntax]: https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient\n\n### Why doesn’t Autoprefixer add prefixes to `border-radius`?\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### Why doesn’t Autoprefixer support `appearance`?\n\nUnlike `transition`, the `appearance` property is not a part of\nany specification. So there is no `appearance`, only `-moz-appearance`\nand `-webkit-appearance`. Quote from [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-appearance):\n\n> Do not use this property on Web sites: not only is it non-standard, but its\n> behavior changes from one browser to another. Even the keyword `none` does not\n> have the same behavior on each form element across different browsers, and\n> some do not support it at all.\n\n### Why does Autoprefixer use CoffeeScript?\n\nJavaScript is very popular, but this is the same reason why its syntax does not\nevolve. There is an entire Internet with a lot of legacy code which should\nbe supported by browsers. If developers add an inappropriate feature then\nit can’t be removed in then next versions but must be supported for a very\nlong time. This is very bad for innovation. To create new, we need to experiment\nand to choose.\n\nAs a result JavaScript doesn’t have even basic syntax features, which are\npresent in other languages like Ruby or Python. There are no string\ninterpolation, short lambda syntax, foreach statement for arrays, string and\narrays slicing, etc. This features are really important and they will be in\nECMAScript 6 (first update of JS syntax after 15 years), but this\nnew specification is still not released and, of course, we must wait until\nall browsers support it.\n\nWith JavaScript preprocessors like CoffeeScript or TypeScript we can bring\ninnovation back. We can add a new operator and use it right now, without waiting\nfor support in all browsers.\n\nAutoprefixer was written in pure JavaScript before. But CoffeeScript made\nAutoprefixer code much cleaner and more readable. Often, 2 lines of code\nbecame 1.\n\nDon’t be afraid of CoffeeScript. It is just a new syntax, not another language\n(like ClojureScript). You can open [examples on CoffeeScript.org] and start\nto code. After a week your eyes will adjust and you will see that CoffeeScript\nis cleaner and more readable.\n\nSituation with CoffeeScript and JavaScript is absolutely the same as with\nCSS preprocessors and postprocessors. How can we develop a CSS postprocessor\nand avoid using a JS preproccesor :).\n\n[examples on CoffeeScript.org]: http://coffeescript.org/\n\n## Usage\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\n### Gulp\n\nYou can use [gulp-autoprefixer](https://github.com/Metrime/gulp-autoprefixer)\nto use Autoprefixer in your Gulp build configuration.\n\n```js\nvar prefix = require('gulp-autoprefixer');\ngulp.src('./css/*.css')\n  .pipe(prefix([\"last 1 version\", \"> 1%\", \"ie 8\", \"ie 7\"], { cascade: true }))\n  .pipe(gulp.dest('./dist/'));\n```\n\n### Brunch\n\nYou can use the\n[autoprefixer-brunch](https://github.com/lydell/autoprefixer-brunch)\nplugin for [Brunch](http://brunch.io/).\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\n```\n\nand add post-compile hook to `config.rb`:\n\n```ruby\nrequire 'autoprefixer-rails'\n\non_stylesheet_saved do |file|\n  css = File.read(file)\n  File.open(file, 'w') do |io|\n    io << AutoprefixerRails.process(css)\n  end\nend\n```\n\nYou can set the browsers option as the second argument in `process` method:\n\n```ruby\nio << AutoprefixerRails.process(css, browsers: [\"last 1 version\", \"> 1%\"])\n```\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 -w file.styl\n```\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### 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.process(css)\n```\n\n### CodeKit\n\nCodeKit, since the 2.0 version, contains Autoprefixer. In the After Compiling\nsection, there is a checkbox to enable Autoprefixer.\nRead [CodeKit docs](https://incident57.com/codekit/help.html#autoprefixer)\nfor more inforamtion.\n\n### Prepros\n\nIf you want to build your assets with a 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<img src=\"http://alphapixels.com/prepros/static/img/prepros.jpg\" width=\"550\" height=\"340\" />\n\n### Broccoli\n\nYou can use the\n[broccoli-autoprefixer](https://github.com/sindresorhus/broccoli-autoprefixer)\nplugin for [Broccoli](https://github.com/joliss/broccoli).\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### 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### Node.js\n\nUse `autoprefixer` npm package:\n\n```js\nvar autoprefixer = require('autoprefixer');\nvar css          = 'a { transition: transform 1s }';\nvar prefixed     = autoprefixer.process(css).css;\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### .NET\n\nYou can use Autoprefixer from .NET and BundleTransformer with the\n[Autoprefixer](https://github.com/digitalcreations/autoprefixer) NuGet package.\n\n### JavaScript\n\nYou can use Autoprefixer in the browser or as a non-Node.js runtime\nwith [standalone version](https://raw.github.com/ai/autoprefixer-rails/master/vendor/autoprefixer.js).\n\n### PostCSS\n\nAutoprefixer can be also used as a [PostCSS](https://github.com/ai/postcss)\nprocessor, so you can combine it with other processors and parse CSS only once:\n\n```js\npostcss().\n    use( autoprefixer(['> 1%', 'opera 12.5']).postcss ).\n    use( compressor ).\n    process(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### Brackets\n\nStyles can processed automatically in Brackets using the\n[brackets-autoprefixer](https://github.com/mikaeljorhult/brackets-autoprefixer)\nextension.\n\n### Atom Editor\n\nYou can process your styles directly in Atom with the\n[atom-autoprefixer](https://github.com/sindresorhus/atom-autoprefixer)\npackage.\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@1.1.20140605",
  "_shasum": "2534cd5d041709ba221187713b81b3862b67db7f",
  "_from": "autoprefixer@~1.1.20140410",
  "_resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-1.1.20140605.tgz"
}