微信小程序引入vant weapp

  首先，第一步，新建项目，项目名称大家随意，也可以自己定义呀。

第二步，初始化一个项目 npm init 一下

 

一路回车

 

第三步，按照微信小程序官方文档需要在小程序根目录下执行 

npm install --production

 

到了这里就安装成功了，环境准备好了，然后就可以开始引入vant ui 了

第四步：执行VantUI提供的安装命令 直接输入安装vant 的命令就可以了 ，其实他这里有两种引入的方式，一个通过 GitHub 来 克隆源文件，然后放入小程序中，在小程序中构建一下就文件就OK了，这里大家感兴趣的话，那就可以自己尝试一下( 这边推荐使用npm 包下载的文件 )

npm i vant-weapp -S --production

 

第五步，启用npm，在详情里面去 点击勾选"使用npm模块就可以了"，如图所示

 

第六步，点击工具上的工具 "构建 npm  "

 

成功之后显示，并且可以看到多了一个：miniprogram_npm 目录（这里就是安装好的VantUI相关控件）：

 

第7步，引入vant 组件，这个可以 app.json里面引入，也可以在 自定自定义的文件 page / index / index.json下面定义

 

下面来看看我们成果，学到这里，是不是感觉特别简单，哈哈哈，大功告成。