1、vue创建项目(步骤忽略)
2、vant下载
(1)npm i vant -S
(2)npm i babel-plugin-import -D (按需引入插件)
// 在.babelrc 中添加配置 (按需引入插件)
{
"plugins": [
["import", {
"libraryName": "vant",
"libraryDirectory": "es",
"style": true }]
]
}
3、适配下载:
npm i lib-flexible --save-dev
main.js引入适配: import 'lib-flexible/flexible'
4、npm install postcss-pxtorem --save-dev
"postcss-pxtorem":{
rootValue:75,//设计稿为750
propList:['*'],
selectorBlackList:['van']//排除van
}
5、vant使用
import { Dialog,Loading } from 'vant';
components:{
[Loading.name]:Loading
}
<van-loading class="btn" type="spinner" />
6、注意:
border使用px,不转化为rem方法: 大写PX ,例:1PX solid #f00;