Wechat applets are installed using the VantUI framework (Vant Weapp) yarn

1. Create a new project

WeChat developer tool version: 1.05.2204180

Choose not to use cloud services and not to use templates

2. Create package.json

Right click on the blank space and open it in an external terminal

Enter yarn initand press Enter (or npm init)

3. Install Vant (weapp)

yarn add @vant/weapp --production

4. Modify app.json

"style": "v2"Remove from app.json

5. Build NPM

tools-build npm

Note: The version used in the picture does not need to be changedproject.config.json

6. Get started

Add a button to

/pages/index/index.json

{
    
    
  "usingComponents": {
    
    
    "van-button": "@vant/weapp/button/index"
  }
}

/pages/index/index.wxml

<!--index.wxml-->
<view class="container">
  <van-button type="default">默认按钮</van-button>
<van-button type="primary">主要按钮</van-button>
<van-button type="info">信息按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>
</view>