首頁 > 軟體

vant開發微信小程式安裝以及簡單使用教學

2022-12-25 14:00:56

 vant官方網站

準備工作

首先準備一個空資料夾,新建微信小程式,把資料夾路徑引入,刪除index.wxml,index.wxss以及index.js中的檔案內容

刪除完畢後重新初始化index.js,在頁面中輸入page

 對外圍的資料夾進行初始化

接下來就是在資料夾下的目錄中調出控制檯輸入以下命令

npm init -y

 

第一步:使用以下命令進行設定 

npm i @vant/weapp -S --production 

安裝完成後出現一個node_modules資料夾就算成功了 

第二步 :刪除app.json中的"style":"v2"

第三步:在詳情中基本設定中勾選npm模組

第四步:點選工具——>構建npm

構建成功即可 

到此為止專案就已經安裝完畢了

接下來就是如何用vant

比如這裡用按鈕控制元件就必須先引入按鈕的設定

app.json是全域性的,index.json只對當前檔案有用 

 效果顯示如下:

比如還想引入單元格樣式

以上就是vant開發微信小程式安裝以及簡單使用教學的詳細內容,更多關於vant開發微信小程式的資料請關注it145.com其它相關文章!


IT145.com E-mail:sddin#qq.com