Use Vant weapp component library in WeChat applet

1. First create a WeChat Mini Program project

Everyone should know everything here

2. Install node.js

Generally, front-end developers will install this.
Please refer to the node installation tutorial for the specific installation process . Remember to install next to the path. Use the default path. Do not change it randomly. After the installation is complete, enter the following command and the version number will be successful (the version is different It's ok)

3. Initialize the node module in the project directory

WeChat Developer ToolsAs an administratorOpen the project that needs to introduce the vant component, click the terminal at the bottom of the console, and enter npm init -y on the new terminal
Insert picture description here
command line
Insert picture description here

4. Install vant weapp

Also enter the following command in the current directory

npm i @vant/weapp -S --production


At this time, you will find a few more files in the directory

5. Build npm

Open the project in WeChat Developer Tools, click Details, check Use npm module

click tool, click Build npm module,

and another folder will be added

6, complete

Now you can use vant weapp a specific usage see the official document, written in great detail, vant weapp official documents
that I write here an example, copy the code official document coming
Insert picture description here
refer to the official documentation, the global registered in this component in app.json

Effect picture

Guess you like

Origin blog.csdn.net/UCB001/article/details/107199469