在使用了amfe-flexible自动px转rem的插件后。
遇到过这个问题，发现无解啊，只要在组件的style里面书写大写的Px单位，vetur都会给你自动转成小写，很尴尬，特别是在用scss的情况下，组件内通过大小单位来让元素大小不自动转rem，无法完成，除非你关闭自动格式化，但是那是不可能的，太难了。
有种鱼和熊掌不可兼得的感觉。
但是作为一个成年人，怎么可能要做选择，我都要...
这个办法也是我灵光一现，突然有的，我说下我的思路。
首先自动转换时因为插件的功能，针对.vue格式的文件，所以在vue文件里面怎么弄，都很难达到理想的需求。
那么，如果我们在其他文件里面呢？
宾狗！！！
是不是感觉醍醐灌顶了，是不是感觉，卧槽，对啊...妙啊...这种想法...
众所周知，现在的css扩展语言都有模块功能，这里以scss为例，scss有mixin和include，一个创建，一个引用，我们可以创建一个全局的mixin变量，然后在vue组件里面引入。
全局变量我之前写过一篇文章： 全局scss变量
我们在全局里面创建一个变量：
@mixin lineWidth {
width: 1Px;}然后在vue对应的组件里面引入
.line {
height: 15px;
background-color: $muted;
@include lineWidth();}最后保存，浏览器刷新，你会发现height自动rem转换了，而width是1px的单位。
selectorBlackList黑名单
自动转换一般都是配合插件postcss-pxtorem的，所以我们还可以设置某些特殊前缀，某个选择器不进行rem转换
打开postcss.config.js配置文件
module.exports = {
plugins: {
'autoprefixer': {
overrideBrowserslist: [
'Android 4.1',
'iOS 7.1',
'Chrome > 31',
'ff > 31',
'ie >= 8'
]
},
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*'],
selectorBlackList: [".line"] //在这里设置黑名单，这里表示.line选择器不会转换，如果想要以某个前缀不进行转换，可以这样书写[".el-"] 这样就表示el-开始的选择器都不进行转换
}
}}
