微信小程序引入@van-Weapp组件库

创建miniprogram文件夹

进入miniprogram文件夹，执行安装命令

npm i @vant/weapp -S --production

勾选“使用npm模块”

微信开发者工具>>设置>>项目设置

image.png

构建npm

微信开发者工具>>工具>>构建npm

image.png

出现上图就是构建成功了，构建成功之后会出现miniprogram_npm文件夹

image.png

引入vant样式

在app.wxss引入样式（官网是这样写的）

@import '@vant/weapp/common/index.wxss'

由于我在项目使用了less，所以我是在app.less文件中引入的

@import 'miniprogram_npm/@vant/weapp/common/index.wxss';

关于引入路径：官网写的路径会找不到，写了绝对路径就ok了

引入组件

在app.json或者需要调用组件的页面.json文件中引入

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

成功

image.png