{"id":13448390,"url":"https://github.com/ai/autoprefixer-rails","last_synced_at":"2025-05-11T05:47:22.036Z","repository":{"id":7856908,"uuid":"9228993","full_name":"ai/autoprefixer-rails","owner":"ai","description":"Autoprefixer for Ruby and Ruby on Rails","archived":false,"fork":false,"pushed_at":"2025-04-12T14:28:49.000Z","size":26400,"stargazers_count":1216,"open_issues_count":7,"forks_count":110,"subscribers_count":18,"default_branch":"master","last_synced_at":"2025-05-11T05:47:15.446Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://twitter.com/autoprefixer","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ai.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"tidelift":"rubygems/autoprefixer-rails"}},"created_at":"2013-04-04T22:01:13.000Z","updated_at":"2025-05-09T09:48:15.000Z","dependencies_parsed_at":"2024-06-20T15:41:22.668Z","dependency_job_id":"5ba18a0a-51e2-48a8-a0ee-105c42e5fc51","html_url":"https://github.com/ai/autoprefixer-rails","commit_stats":{"total_commits":999,"total_committers":58,"mean_commits":"17.224137931034484","dds":"0.13613613613613618","last_synced_commit":"e363c129961e2c237ba48549f65c3b7ef3238c73"},"previous_names":[],"tags_count":227,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ai%2Fautoprefixer-rails","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ai%2Fautoprefixer-rails/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ai%2Fautoprefixer-rails/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ai%2Fautoprefixer-rails/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ai","download_url":"https://codeload.github.com/ai/autoprefixer-rails/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253523730,"owners_count":21921818,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-31T05:01:44.139Z","updated_at":"2025-05-11T05:47:22.017Z","avatar_url":"https://github.com/ai.png","language":"Ruby","funding_links":["https://tidelift.com/funding/github/rubygems/autoprefixer-rails","https://tidelift.com/security"],"categories":["Ruby","Assets","Gems","Uncategorized"],"sub_categories":["CSS","Uncategorized","Articles"],"readme":"# Autoprefixer Rails [![Build Status][ci-img]][ci]\n\n\u003cimg align=\"right\" width=\"94\" height=\"71\"\n     src=\"http://postcss.github.io/autoprefixer/logo.svg\"\n     title=\"Autoprefixer logo by Anton Lovchikov\"\u003e\n\n[Autoprefixer] is a tool to parse CSS and add vendor prefixes to CSS rules\nusing values from the [Can I Use] database. This gem provides Ruby\nand Ruby on Rails integration with this JavaScript tool.\n\n\u003ca href=\"https://evilmartians.com/?utm_source=autoprefixer-rails\"\u003e\n\u003cimg src=\"https://evilmartians.com/badges/sponsored-by-evil-martians.svg\" alt=\"Sponsored by Evil Martians\" width=\"236\" height=\"54\"\u003e\n\u003c/a\u003e\n\n[Autoprefixer]:     https://github.com/postcss/autoprefixer\n[Can I Use]:        http://caniuse.com/\n[PostCSS]:          https://postcss.org/\n[ci-img]:           https://github.com/ai/autoprefixer-rails/actions/workflows/ci.yml/badge.svg\n[ci]:               https://github.com/ai/autoprefixer-rails/actions/workflows/ci.yml\n\n## Differences\n\nThe best way to use Autoprefixer is with webpack or Gulp.\n\nAutoprefixer Rails doesn’t support these Autoprefixer features:\n\n* Browsers in `package.json`.\n* Custom browsers usage statistics.\n\n## Usage\n\nWindows users should install [Node.js]. Autoprefixer Rails doesn’t work with\nold JScript in Windows.\n\nAutoprefixer Rails uses [ExecJS] that will use the best available JavaScript\nruntime. Currently this gem is tested to work with Node.js version 10 and up\nand with [mini_racer], but will not work with [therubyracer].\n\n[Node.js]: http://nodejs.org/\n[ExecJS]: https://github.com/rails/execjs\n[mini_racer]: https://github.com/discourse/mini_racer\n[therubyracer]: https://github.com/cowboyd/therubyracer\n\n### Ruby on Rails\n\nAdd the `autoprefixer-rails` gem to your `Gemfile`:\n\n```ruby\ngem \"autoprefixer-rails\"\n```\n\nClear your cache:\n\n```sh\nrake tmp:clear\n```\n\nWrite your CSS (Sass, Stylus, LESS) rules without vendor prefixes\nand Autoprefixer will apply prefixes for you.\nFor example in `app/assets/stylesheet/foobar.sass`:\n\n```sass\n:fullscreen a\n  display: flex\n```\n\nAutoprefixer uses the Can I Use database with browser statistics and properties\nsupport to add vendor prefixes automatically using the Asset Pipeline:\n\n```css\n:-webkit-full-screen a {\n    display: -webkit-box;\n    display: -webkit-flex;\n    display: flex\n}\n:-moz-full-screen a {\n    display: flex\n}\n:-ms-fullscreen a {\n    display: -ms-flexbox;\n    display: flex\n}\n:fullscreen a {\n    display: -webkit-box;\n    display: -webkit-flex;\n    display: -ms-flexbox;\n    display: flex\n}\n```\n\nIf you need to specify browsers for your Rails project, you can save them\nto `.browserslistrc` and place it under `app/assets/stylesheets/`\nor any of its ancestor directories\n\n```\n\u003e 1%\nlast 2 versions\nIE \u003e 8 # comment\n```\n\nSee [Browserslist docs] for config format. But `\u003e 5% in US` query is not\nsupported in Rails, because of ExecJS limitations. You should migrate to webpack\nor Gulp if you want it.\n\n__Note: you have to clear cache (`rake tmp:clear`) for the configuration\nto take effect.__\n\nYou can get what properties will be changed using a Rake task:\n\n```sh\nrake autoprefixer:info\n```\n\nTo disable Autoprefixer just remove postprocessor:\n\n```ruby\nAutoprefixerRails.uninstall(Rails.application.assets)\n```\n\n[Browserslist docs]: https://github.com/ai/browserslist\n[Firefox ESR]:       http://www.mozilla.org/en/firefox/organizations/faq/\n\n### Sprockets\n\nIf you use Sinatra or another non-Rails framework with Sprockets,\njust connect your Sprockets environment with Autoprefixer and write CSS\nin the usual way:\n\n```ruby\nassets = Sprockets::Environment.new do |env|\n  # Your assets settings\nend\n\nrequire \"autoprefixer-rails\"\nAutoprefixerRails.install(assets)\n```\n\n### Ruby\n\nIf you need to call Autoprefixer from plain Ruby code, it’s very easy:\n\n```ruby\nrequire \"autoprefixer-rails\"\nprefixed = AutoprefixerRails.process(css, from: 'main.css').css\n```\n\n### Compass\n\nYou should consider using Gulp instead of Compass binary,\nbecause it has better Autoprefixer integration and many other awesome plugins.\n\nBut if you can’t move from Compass binary right now, there’s a hack\nto run Autoprefixer after `compass compile`.\n\nInstall `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  map = file + '.map'\n\n  if File.exists? map\n    result = AutoprefixerRails.process(css,\n      from: file,\n      to:   file,\n      map:  { prev: File.read(map), inline: false })\n    File.open(file, 'w') { |io| io \u003c\u003c result.css }\n    File.open(map,  'w') { |io| io \u003c\u003c result.map }\n  else\n    File.open(file, 'w') { |io| io \u003c\u003c AutoprefixerRails.process(css) }\n  end\nend\n```\n\n## Visual Cascade\n\nBy default, Autoprefixer will change CSS indentation to create nice visual\ncascade of prefixes.\n\n```css\na {\n  -webkit-box-sizing: border-box;\n     -moz-box-sizing: border-box;\n          box-sizing: border-box\n}\n```\n\nYou can disable this by specifying `cascade: false` in `config/autoprefixer.yml`\nor in `process()` options.\n\n## Source Map\n\nAutoprefixer will generate a source map if you set `map` option to `true` in\n`process` method.\n\nYou must set input and output CSS files paths (by `from` and `to` options)\nto generate a correct map.\n\n```ruby\nresult = AutoprefixerRails.process(css,\n    map:   true,\n    from: 'main.css',\n    to:   'main.out.css')\n```\n\nAutoprefixer can also modify previous source map (for example, from Sass\ncompilation). Just set original source map content (as string) as `prev`\nin the `map` option.\n\n```ruby\nresult = AutoprefixerRails.process(css, {\n    map:   { prev: File.read('main.sass.css.map') },\n    from: 'main.sass.css',\n    to:   'main.min.css')\n\nresult.map #=\u003e Source map from main.sass to main.min.css\n```\n\nSee all options in [PostCSS docs]. AutoprefixerRails will convert Ruby style\nto JS style, so you can use `map: { sources_content: false }`\ninstead of camelcase `sourcesContent`.\n\n[PostCSS docs]: https://github.com/postcss/postcss#source-map-1\n\n\n## Security Contact\n\nTo report a security vulnerability, please use the [Tidelift security contact].\nTidelift will coordinate the fix and disclosure.\n\n[Tidelift security contact]: https://tidelift.com/security\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fai%2Fautoprefixer-rails","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fai%2Fautoprefixer-rails","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fai%2Fautoprefixer-rails/lists"}