Vue2.0配置postcss-px2rem移动端iPhone6设计稿750x1334，直接按这个尺寸写就行，会自动转成

一、创建vue项目

1、安装node（自带npm包管理工具）

2、安装vue2.x脚手架：npm install vue-cli -g，控制台输入vue list查看是否安装成功

3、vue脚手架生成项目：vue init webpack my-project

二、安装并配置插件

1、安装postcss-px2rem：npm install postcss-px2rem

2、配置：找到文件build/vue-loader.config.js，添加如下：

const px2rem = require('postcss-px2rem')

// 配置remUnit
postcss: function() {
    return [px2rem({remUnit: 75})];
}

3、在index.html中设置根字体大小font-size：

<script>
    document.getElementsByTagName('html')[0].style.fontSize = (document.documentElement.clientWidth ||  document.body.clientWidth) /10 + 'px';
    window.addEventListener("resize",()=>{
        document.getElementsByTagName('html')[0].style.fontSize = (document.documentElement.clientWidth ||  document.body.clientWidth) /10 + 'px';
    });
</script>

三、看效果

移动端iPhone6设计稿750x1334，直接按这个尺寸写就行，会自动转成rem，不同分辨率已根据index.html那段js进行适配了。