首先介紹什么是vant
Vant 是一個輕量、可定制的移動端組件庫，于 2017 年開源。
目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社區(qū)團隊維護(hù) React 版本和支付寶小程序版本。
Vant 是有贊前端團隊開源的移動端組件庫，于 2017 年開源，已持續(xù)維護(hù) 4 年時間。Vant 對內(nèi)承載了有贊所有核心業(yè)務(wù)，對外服務(wù)十多萬開發(fā)者，是業(yè)界主流的移動端組件庫之一。
Vant框架是一個用來做移動端開發(fā)的框架。
詳情請點擊vant官網(wǎng)
下面一一展示使用的步驟：
一、第一步，打開我們小程序項目目錄，找到所在的位置，打開終端
或者是 打開調(diào)試器點擊終端。
二、對項目進(jìn)行初始化
npm init
此時看下圖：
三、進(jìn)行安裝依賴
1、通過npm安裝vant/weapp
npm i @vant/weapp -S --production
2、安裝miniprogram
npm i miniprogram-sm-crypto --production
進(jìn)行安裝完畢后，回發(fā)現(xiàn)目錄下多了一些文件
四、修改app.json
將 app.json 中的 “style”: “v2” 去除，原因是小程序的新版基礎(chǔ)組件強行加上了許多樣式，難以覆蓋，不關(guān)閉將造成部分組件樣式混亂。
五、修改project.config.json
開發(fā)者工具創(chuàng)建的項目，miniprogramRoot 默認(rèn)為 miniprogram，package.json 在其外部，npm 構(gòu)建無法正常工作。需要手動在 project.config.json 內(nèi)添加如下配置，使開發(fā)者工具可以正確索引到 npm 依賴的位置。
此處這里也可以寫成 這樣的形式
"miniprogramNpmDistDir": "./"
六、然后構(gòu)建npm 需要點擊左上角的工具欄
構(gòu)建成功，會出現(xiàn)如下圖所示：
點擊確定即可。
七、然后點擊右上角的詳情—本地設(shè)置----使用npm模塊（在以前的版本中是有一個點擊使用npm模塊的，需要對其進(jìn)行勾選，但是在新版是沒有的，這個不需要管。）
八、使用組件
我這里在全局里面注冊一個按鈕，然后使用它。先去app.json中注冊
這個是使用一個vant組件，去對應(yīng)的去引用，這個路徑對應(yīng)的是如下圖所示：
文章來源：http://www.zghlxwxcb.cn/news/detail-498446.html
九、最后就可以在我們的項目中使用組件了
文章來源地址http://www.zghlxwxcb.cn/news/detail-498446.html
到了這里，關(guān)于在微信小程序中怎么使用vant框架？的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
