小程序中使用 npm

引入 Vant Weapp 为例：

通过 npm 安装

1. 在小程序目录下运行命令行 npm init -y 初始化

npm init -y

2. 安装 Vant Weapp

npm i vant-weapp -S --production

3. 打开微信开发者工具，在右上角 详情 > 本地设置 勾选使用 npm 模块

2FCB895F-C4EB-4c1c-B991-11DC1299F407.png

4. 点击 工具 > 构建 npm，构建完成就可以引入使用。
5. 引入组件并使用
以 Button 组件为例，在app.json中或者单独页面对应的json文件中配置路径。

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

在 wxml 中使用组件

Button

{DE4ADC48-5E26-4113-89D5-B95C908E353C}_20191015093337.jpg

通过 dist 文件夹引入

1.在git上下载对应文件 https://github.com/youzan/vant-weapp
2. 下载的文件中把 dist 目录拷贝到小程序目录下

{908B1214-A968-4E53-8549-62316DEAA144}_20191015094414.jpg

3. 引入方式及使用方法和之前相同，配置的时候路径需要调整

"usingComponents": {
  "van-button": "/dist/button/index"
}