这篇文章主要介绍了Vant的安装和配合引入Vue.js项目里的方法步骤，小
本文来源gaodai.ma#com搞#代!码网_编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
1.安装vant
npm i vant -S：这是简写形式。
npm install vant --save:这是完整写法。
如果你网络很慢的话，可以使用淘宝的源，但是不建议使用cnpm来进行安装。
npm install vant --save --registry=https://registry.npm.taobao.org
淘宝镜像，速度快，安装后查看package.json文件里看是否安装完成
2.1使用 babel-plugin-import (推荐)
babel-plugin-import 是一款 babel 插件，它会在编译过程中将 import 的写法自动转换为按需引入的方式
# 安装 babel-plugin-import 插件 npm i babel-plugin-import -D
2.2 文件.babelrc文件配置
"plugins":[ "transform-runtime", ["import",{ "libraryName":"vant", "libraryDirectory":"es", "style":true }] ],
更新了vue版本后。重新配置上述文件
"plugins": [ "transform-vue-jsx", "transform-runtime", ["import", [{ "libraryName": "vant","libraryDirectory":"es","style": true }]] ]
页面按需引入；
可以再main.js里写，也可以在引用的组件页面写，根据自己需求或喜好。我喜好第2种写法
1.main.js:
import { Button } from 'vant' Vue.use(Button)
2.或者在引用的组件页面
<div class="detail"> <div class="slide"> 1 2 3 4 </div> 主要按钮 </div>
官方文档参考：https://youzan.github.io/vant/#/zh-CN/quickstart
以上就是Vant的安装和配合引入Vue.js项目里的方法步骤的详细内容，更多请关注gaodaima搞代码网其它相关文章！
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：Vant的安装和配合引入Vue.js项目里的方法步骤
转载请注明原文链接：Vant的安装和配合引入Vue.js项目里的方法步骤
