手机端 pc端 屏幕自适应
一、新建 vue.config.js项目目录中没有 vue.config.js 文件，需要手动创建,在根目录中创建 vue.config.js
const pxtorem = require('postcss-pxtorem') module.exports = { css: { loaderOptions: { postcss: { plugins: [ pxtorem({ rootValue: 37.5, propList: ['*'], // 该项仅在使用 Circle 组件时需要 // 原因参见 https://github.com/youzan/vant/issues/1948 selectorBlackList: ['van-circle__layer'] }) ] } } } }
二、安装lib-flexible
npm install amfe-flexible -s
三、main.js引入
import 'amfe-flexible'
四、index.html要设置meta
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<title>Project Management System</title>
</head>
<body>
<div id="app">
</div>
<!-- built files will be auto injected -->
</body>
</html>
五、关于
关于使用 为了要使用vant的样式，rootValue应设置为37.5 设计图是750px宽的，则写的时候如果用px 则需要除以2，如果用rem的话，要自行计算 px/75=rem，或者使用IDE的插件计算
atzhang