【前端工程化】postcss.config.js配置的样式的autoprefixer没有生效

假设我们在postcss.config.js中的配置如下

module.exports = {
  plugins: {
    'postcss-import': {},
    tailwindcss: {},
    autoprefixer: {},
  },
};

测试autoprefixer这个插件是否生效,只需要下一个测试的css用display:flex这个属性就可以检测

.test {
    display: flex;
}

这个时候npm run build打包出来的代码依旧没有加上自动前缀,所以重点是需要在package.json中加上browerlist

{
    "browserslist": [
        "cover 99.5%"
    ]
}

此时打包后的test样式如下

.test{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}

猜你喜欢

转载自blog.csdn.net/qq_17335549/article/details/129238415