postcss后处理器配置autoprefix postcss后处理器配置autoprefix

postcss后处理器配置autoprefix 【postcss后处理器配置autoprefix】前言scss为css的预处理器拉，其实就是让css可以使用变量而已，那么postcss就是后处理器拉
本文讲的就是他的autoprefix插件可以自动添加浏览器css前缀
安装 cnpm i -D sass node-sass postcss-cli autoprefix
cnpm i -D postcss postcss-cli autoprefix
package.json

"scripts": { "build": "node-sass style.scss style.css --output-style expanded && postcss style.css -o style.css" },

browserslist

"browserslist": [ "last 5 Firefox versions", "Safari >= 6", "ie >= 8", "Edge 16", "> 1%", "last 1 Android versions", "last 1 ChromeAndroid versions", "last 2 Chrome versions", "last 2 Firefox versions", "last 2 iOS versions", "last 2 Edge versions", "last 2 Opera versions" ],

postcss.config.js

module.exports = { plugins: [ require('autoprefixer') ] }

style.scss

a{ transition :transform 1s }body { user-select: none }

style.css

a { -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; }body { -webkit-user-select: none; -ms-user-select: none; user-select: none; }