Vue.js 2 Web Development Projects

Auto-prefixing CSS with PostCSS

When writing CSS (or Stylus) code, we want it to be compatible with most browsers. Fortunately, there are tools that will do this automatically for us, for example, by adding vendor-prefixed versions of the CSS properties (such as -webkit-user-select and -moz-user-select).

PostCSS is a library specialized in CSS postprocessing. It has a very modular architecture; it works by adding plugins to it that process the CSS in various ways.

We don't have to install it. vue-loader already has PostCSS included. We only have to install the plugins we want. In our case, we need the autoprefixer package to make our CSS code compatible with more browsers.

1. Install the autoprefixer package:

      npm i -D autoprefixer

2. For PostCSS ...