美文网首页前端收藏集
vue-cli 3.0中配置postcss支持rem、vw布局

vue-cli 3.0中配置postcss支持rem、vw布局

作者: 熠辉web3 | 来源:发表于2019-08-28 16:25 被阅读0次

    vue.config.js 相关代码如下

    
    module.exports = {
        lintOnSave: true,
        css: {
            loaderOptions: {
                postcss: {
                    plugins: [
                        require('postcss-pxtorem')({
                            rootValue: 16,
                            selectorBlackList: ['el'], // 忽略转换正则匹配项
                            propList: ['*'],
                        }),
                        require('postcss-px-to-viewport')({
                            viewportWidth: 750, //根据视觉稿的宽度进行设置
                            unitPrecision: 5,
                            viewportUnit: 'vw',
                            selectorBlackList: ['el'], //忽略转换的css选择器
                            minPixelValue: 1,
                            mediaQuery: false
                        }),
                    ]
                }
            }
        },
    }
    

    相关文章

      网友评论

        本文标题:vue-cli 3.0中配置postcss支持rem、vw布局

        本文链接:https://www.haomeiwen.com/subject/itrmectx.html