Vue实现移动端适配方案

Vue实现移动端适配步骤如下：
安装amfe-flexible和postcss-pxtorem：

npm install amfe-flexible --save-dev
npm install postcss-pxtorem --save-dev

在main.js中导入amfe-flexible

import 'amfe-flexible'

新建一个postcss.config.js文件，配置如下：

module.exports = {
    //...其他配置
    css: {
        loaderOptions: {
            postcss: {
                plugins: [
                    require('postcss-pxtorem')({
                        rootValue: 37.5,
                        propList: ['*']
                    })
                ]
            }
        }
    },   		
    "plugins": {
        'postcss-pxtorem': {
            rootValue: 37.5,
            propList: ['*']
        }
    }		
}

• rootValue根据设计稿宽度除以10进行设置，这边假设设计稿为375，即rootValue设为37.5；
• propList是设置需要转换的属性，这边*为所有都进行转换。