vue项目px自动转rem适用于pc端

vue项目px自动转rem适用于pc端

第一步

1. 首先安装：autoprefixer postcss-pxtorem lib-flexible 三个依赖 npm cnpm yarn 都可以
   
   postcss-pxtorem是PostCSS的插件，用于将像素单元生成rem单位
   安装命令：
   npm install postcss-pxtorem -D

lib-flexible是淘宝团队总结出来的移动端弹性布局适配方案
Autoprefixer是一款自动管理浏览器前缀的插件，可以解析css文件并且添加前缀到css内容里，使用Can I Use(caniuse网站)的数据决定哪些前缀是需要的。该插件css解析器采用postcss，使用Browserslist库，可以对浏览器的版本做精确设置。
安装命令：
npm install lib-flexible --save
npm install --save -dev autoprefixe

第二步

2. 在main.js中引入lib-flexible
   

3. vue.config.js中导入autoprefixer和postcss-pxtorem
   

第三步

4.在node_modules/lib-flexible/flexible.js中找到refreshRem方法把540修改为width
修改原因：flexible原本是用于移动端适配的，所以他这里限制了最大屏幕宽度为540，我们要用于pc端，就需要吧这里最大宽度限制改掉。
全部操作完之后重新npm run xxx就ok啦