Skip to content
Switch branches/tags

Latest commit

This addon does not ship any templates so there is no need for `ember-cli-htmlbars` in `dependencies` as it's actually used only during tests run.

Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Autoprefixer for Ember CLI Build Status

This addon runs the styles of your Ember CLI-project through Autoprefixer.


  • Ember.js v3.20 or above
  • Ember CLI v3.20 or above
  • Node.js v12 or above


ember install ember-cli-autoprefixer


This addon first consumes your browser list config from config/targets.js. This is the browser list for Babel.

You can manually configure what browsers to target for autoprefixer only. Add the target browsers to your package.json as per, add a .browserslistrc file, or configure overrideBrowsersList in ember-cli-build.js.

// ember-cli-build.js
var app = new EmberApp(defaults, {
  autoprefixer: {
    overrideBrowserslist: ['IE11'],
    cascade: false

This would prefix styles as required by the two latest version of ios, and disable the cascade (see below).

You can disable Autoprefixer by passing in enabled: false.

Other options would also go here along with overrideBrowserslist, enabled and cascade.

You can read more about these settings and others over on the Autoprefixer page.

Note on using with ember-cli-sass

Autoprefixer doesn't play well with files, but it will work with embedded source maps. This means there are two options.

If you want to disable CSS sourcemaps from ember-cli-sass update ember-cli-build.js to

  sassOptions: {
    // This tells ember-cli-sass to avoid generating the sourcemap file (like
    sourceMap: false

Alternatively, you may use embedded source maps. So we tell ember-cli-sass to embed the sourcemaps and then turn on sourcemaps with autoprefixer which will update the embedded sourcemap after adding prefixes.

  sassOptions: {
    sourceMap: true,
    sourceMapEmbed: true
  autoprefixer: {
    enabled: true,
    cascade: true,
    sourcemap: true

Also note you can optionally disable in production!

  const envIsProduction = (process.env.EMBER_ENV === 'production');


  sassOptions: {
    sourceMap: !envIsProduction,
    sourceMapEmbed: !envIsProduction
  autoprefixer: {
    enabled: true,
    cascade: true,
    sourcemap: !envIsProduction