微信小程序npm引入vant-weapp的踩坑記錄
微信小程序項(xiàng)目使用npm安裝vant-weapp的正確步驟
使用npm安裝vant-weapp 到項(xiàng)目根目錄下：
npm i vant-weapp -S --production
然后再詳情中選中使用npm模塊，然后點(diǎn)擊工具欄中的構(gòu)建npm。本以為這樣就可以安裝成功了，結(jié)果
沒有找到npm包
這讓我糾結(jié)了一個(gè)早上?？戳宋臋n，琢磨了很久，最后研究出問題的關(guān)鍵。
第一步：使用cmd進(jìn)入項(xiàng)目根目錄：npm init
然后一直按回車
第二步：輸入你要安裝的文件（npm i vant-weapp -S --production ）
如果已經(jīng)之前安裝了vant-weapp的，就直接到工具欄中選中構(gòu)建npm就可以了，如果沒有就安裝好再選中構(gòu)建npm。
我以為這樣就可以使用vant-weapp框架了，然后刷新項(xiàng)目，問題來了。。。
錯(cuò)誤1
大概意思-找不到組件
明明步驟都對了，卻還是出錯(cuò)。然后就網(wǎng)上找找問題。網(wǎng)上說：
解決方法：
你只需要把miniprogram_npm/vant-weapp里的組件文件夾都刪除，
之后再https://github.com/youzan/vant-weapp下載一份vant， 將dist文件夾（vant-weapp-dev\vant-weapp-dev\dist）中的文件復(fù)制到項(xiàng)目的miniprogram_npm/vant-weapp
原文：http://www.dhdzp.com/article/166771.htm
還有就是重新安裝vant-weapp。重新安裝是可以的，不會(huì)報(bào)錯(cuò)。
錯(cuò)誤2
引入頁面的的.json一定要寫對，不然也會(huì)報(bào)錯(cuò)。
{
"usingComponents": {
"van-button": "vant-weapp/button" //添加這個(gè)
}
}
引入成功
emmmmm，問題不斷，戰(zhàn)火不熄，BUG之路還在繼續(xù)。
總結(jié)
以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，謝謝大家對腳本之家的支持。
相關(guān)文章
js實(shí)現(xiàn)可以點(diǎn)擊收縮或張開的懸浮窗
這篇文章主要介紹了js實(shí)現(xiàn)可以點(diǎn)擊收縮或張開的懸浮窗效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09
微信小程序自定義彈窗實(shí)現(xiàn)詳解(可通用）
這篇文章主要介紹了微信小程序自定義彈窗實(shí)現(xiàn)詳解(可通用）,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-07-07
JavaScript中實(shí)現(xiàn)頁面跳轉(zhuǎn)的幾種常用方法總結(jié)
本文主要介紹了網(wǎng)頁開發(fā)中頁面跳轉(zhuǎn)的概念和重要性,及使用JS實(shí)現(xiàn)頁面跳轉(zhuǎn)的幾種常見方法,包括使用window.location.href,window.location.replace(),window.location.assign(),window.open(),form表單提交以及HTML的a標(biāo)簽等方法實(shí)現(xiàn)頁面跳轉(zhuǎn),需要的朋友可以參考下2024-10-10
這篇文章主要介紹了JS解析XML文件和XML字符串詳解，推薦給大家，有需要的小伙伴可以參考下。2015-04-04
使用BootStrap實(shí)現(xiàn)用戶登錄界面UI
本文給大家介紹使用BootStrap實(shí)現(xiàn)用戶登錄界面UI，布局風(fēng)格采用左右各一半的風(fēng)格設(shè)計(jì)，非常不錯(cuò)，具有參考借鑒價(jià)值，感興趣的朋友一起學(xué)習(xí)吧2016-08-08
Varlet組件實(shí)現(xiàn)一個(gè)絲滑的點(diǎn)擊水波效果詳解
這篇文章主要為大家介紹了Varlet組件實(shí)現(xiàn)一個(gè)絲滑的點(diǎn)擊水波效果示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-10-10
我們已經(jīng)知道，null?沒有任何的屬性值，并且無法獲取其實(shí)體（existence）值。所以?null.property?返回的是錯(cuò)誤（error）而不是?undefined?。2008-09-09
原生JS封裝拖動(dòng)驗(yàn)證滑塊的實(shí)現(xiàn)代碼示例
這篇文章主要介紹了原生JS封裝拖動(dòng)驗(yàn)證滑塊的實(shí)現(xiàn)代碼示例，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06
這篇文章主要介紹了js判斷子窗體是否關(guān)閉的方法,涉及javascript針對子窗體的獲取與屬性判定技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
JavaScript隊(duì)列數(shù)據(jù)結(jié)構(gòu)詳解
這篇文章主要介紹了JavaScript隊(duì)列數(shù)據(jù)結(jié)構(gòu)詳解，隊(duì)列是一種先進(jìn)先出的數(shù)據(jù)結(jié)構(gòu)，隊(duì)列中允許兩種基礎(chǔ)操作，也就是插入和刪除，也就是入隊(duì)和出隊(duì)2022-07-07