如何使用第三方ui庫vant-weapp
1==》創建文件夾demo
2==》 在小程序 中打開 注意 要先在小程序中打開
如果要想在小程序的開發工具中打開某一個 文件夾
要么是空文件夾 要么有一個 project.config.json的配置
2==》 cmd ==> npm init -y 生成包描述文件 package.json
按照官網提示
3==》npm i @vant/weapp -S --production 注意版本
4==》步驟二 構建 npm 包
打開微信開發者工具，點擊 工具 -> 構建 npm，並勾選 使用 npm 模塊 選項，構建完成后，即可引入組件
5==》引入組件
以 Button 組件為例，只需要在app.json 中添加如下
"usingComponents": {
"van-button": "@vant/weapp/button"
}
6==>在某個頁面就可以使用了按鈕了
<van-button plain type="primary">朴素按鈕</van-button>
<van-button plain type="info">朴素按鈕</van-button>
使用第三方庫的注意點###
在使用其他組件時，要引入與之對應的組件
注意組件是否正確
"usingComponents": {
"van-cell": "path/to/@vant/weapp/dist/cell/index",
"van-cell-group": "path/to/@vant/weapp/dist/cell-group/index"
}
上面這種 引入要不得
將path/to去除 dist也要去除。
正確應該為
"van-cell": "@vant/weapp/cell/index",
"van-cell-group": "@vant/weapp/cell-group/index"
否則找不到路徑 會報錯
