一：项目中引入lib-flexible
（1）项目中安装lib-flexible
```
npm install lib-flexible --save
```
（2）项目入口文件main.js中引入lib-flexible
```
import 'lib-flexible'
```
删除项目根目录下的index.html的meta标签，因为lib-flexible会自动在html的head中添加meta。同时自动设置html的font-size为屏幕宽度除以10，也就是说 1rem = 屏幕宽度/10。比如我们的设计稿是750px，1rem = 75px。假如某个元素是200px，那么我们在css里写这个元素宽度就是200/75=2.67rem，后边其他元素设置的宽度都是 设计图元素宽度/75 rem。这样很难计算，开发效率也低，我们可以使用px2rem-loader自动将css中的px转成rem，有了px2rem-loader我们可以在css中直接写设计图中的px值，由这个插件将px转成rem单位进行适配
二： 安装px2rem-loader
```
npm install px2rem-loader --save-dev
```
(1)修改build/utils.js，在exports.cssLoaders中添加如下代码：
```
const px2remLoader = {
loader: 'px2rem-loader',
options: {
remUnit: 37.5 //设计稿的1/10
}
}
```
（2）修改generateLoaders方法中的 const loaders 一行
将const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
改为：
```
const loaders = options.usePostCSS ? [cssLoader, postcssLoader, px2remLoader] : [cssLoader, px2remLoader]
```
设置完重启项目即可。
注意：px2rem-loader只能自动转化css中的px值，js中想要设置宽高进行适配话，就需要我们自己手动计算出rem值
font-size:28px;/*px*/则不会被转换
