Welcome to WuJiGu Developer Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
332 views
in Technique[技术] by (71.8m points)

vuejs单文件组件,style标签样式怎么使用Autoprefixer呢?

首先我使用了less,代码如下:

<style scoped lang="less" rel="stylesheet/less">
    .testUl{
        &{
            background-color:antiquewhite;
            display: flex;
        }
        li{
            height: 30px;
            line-height: 30px;
            color: black;
        }
    }
    .myDiv{
        &{
            color:#FF0000;
        }
        p{
            &:nth-of-type(2){
                font-size:30px;
            }
        }
    }
</style>

在工程文件里面配置了less-loader:
clipboard.png
less可以正常编译为css,目前想使用autoprefixer,已经npm了autoprefixer包,上面的配置文件也写了,但是没有效果,是不是那里配置错了?


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

你用的是webpack1还是2,估计是2吧,2的话需要以下操作:
需要安装postcss-loader

var autoprefixer = require('autoprefixer');

   rules: [{
            test: /.vue$/,
            loader: 'vue-loader',
            options: {
                // vue-loader options go here
                postcss: [require('autoprefixer')({ browsers: ['last 10 Chrome versions', 'last 5 Firefox versions', 'Safari >= 6', 'ie > 8'] })]
            }
        }

官方文档


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to WuJiGu Developer Q&A Community for programmer and developer-Open, Learning and Share
...