爲了兼容各個瀏覽器之間的私有屬性,前端開發人員在寫css的時候須要給一些css屬性添加多個私有前綴,很是麻煩。這裏給你們分享一個簡單的方法能夠讓你之後無需手動給CSS添加私有屬性。css
-moz
表明firefox瀏覽器私有屬性-ms
表明IE瀏覽器私有屬性-webkit
表明chrome、safari私有屬性-o
表明opera私有屬性
項目目錄內終端下輸入前端
yarn add postcss
項目根目錄下新建postcss.config.js
文件
postcss.config.jswebpack
const autoprefixer = require('autoprefixer')
module.exports = {
plugins: [
autoprefixer(),
]
}
打開webpack.config.js
添加如下代碼web
module.exports = {
module: {
rules: [
{
test: /\.css$/,
use: ["style-loader", "css-loader", "postcss-loader"]
}
]
}
}
保存便可。chrome