How to enable autoprefixer in roots bud sage 10?

bud
1

Good Afternoon,

I just want to ask if autoprefixer was auto enable when using bud or do I need to set up it in my bud.config.js? Also, I cannot see any prefix in inspect element. Example I put these in my scss file:

-webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;

After I compile it using yarn dev or yarn build and check the inspect element, it only show transition: all .5s without prefix.

I’m using bud-sass extension.

2

Hm, it may well be that the CSS transition property doesn’t need vendor-prefixes anymore in all recent browsers:

“recent” is key here, the autoprefixer can be configured to support a specific range of browsers.
E.g. Last 2 versions means the last 2 versions of major browsers.

In contrast, CSS masks still needs vendor prefixing for current browser releases:

You should notice this in the output, too.

3

Have you also installed @roots/bud-postcss package?

yarn add @roots/bud-postcss --dev

Autoprefixer comes as a PostCSS plugin.

2 Likes