vue2中通过来适配大屏分辨率，做到自适应（二）

1.通过插件安装

//把全局的px换成rem
npm install amfe-flexible --save

//vue2版本的一定要5.1.1，要不然就g
npm install [email protected] --save-dev

2.项目里会有一个.postcssrc.js文件， 或者 postcss.config.js，没有就创建

module.exports = {
    "plugins": {
        "postcss-import": {},
        "postcss-url": {},
        // to edit target browsers: use "browserslist" field in package.json
        "autoprefixer": {},
        'postcss-pxtorem': {
            rootValue: 192, //一般是设计宽的1/10
            propList: ['*']
        }
    }
}

3.main.js引入转换rem的插件

import 'amfe-flexible';

注意注意：以上操作是可以做到适配的，切记切记一点，代码一定要写规范，最好是一开始就合理的安装1920*1080设计图上所有尺寸来写，包括嵌套div的时候如果不设置宽度高度页面也会畸形，比如一个div是200px，另一个如果不知道，那么就要calc(100% - 200px)一定要等分100%尺寸，否则也会畸形

参考大佬文献：https://www.cnblogs.com/zhurong/p/14011857.html