webpack学习

解决使用postcss-loader不生效问题

2020-03-28  本文已影响0人  景元合

前言

今天使用postcss-loader时候,发现在浏览器使用postcss-loader解决css3兼容性问题时候,一直没生效,google了一下是因为没设置浏览器版本,在此特意记录一下。

安装

yarn add postcss-loader autoprefixer --dev

配置webpack.config.js

{
    test:/\.scss/,
    use:['style-loader',{
        loader:'css-loader',
        options:{
            modules:true,
            importLoaders:2
            }
        },
        'sass-loader',
        'postcss-loader'
        ]
}

根目录创建postcss.config.js

就是因为这里没有配置支持的浏览器版本才没有生效

module.exports = {
    plugins:[
        require("autoprefixer")({
            overrideBrowserslist:[
                "defaults",
                "Android 4.1",
                "iOS 7.1",
                "Chrome>31",
                "ff>31",
                "ie>=8",
                "last 2 versions",
                ">0%"
            ]
        })
    ]
}
上一篇下一篇

猜你喜欢

热点阅读