微信小程序使用npm包

微信小程序使用npm包 (vant)

第一部

1.初始化

npm init

2.在小程序中加载npm包

npm install miniprogram-datepicker --production

3.构建npm包

在微信小程序开发工具的「工具」菜单下点击「构建 npm」命令，进行 npm 包的构建，此构建可以将 npm 包构建成在小程序中可加载使用的包。

第二部

1.安装vant weapp

npm i @vant/weapp -S --production

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-CrGL4inR-1579000061590)(E:\笔记\img\使用npm模块.png)]

2.引入组件

以 Button 组件为例，只需要在app.json或index.json中配置 Button 对应的路径即可。如果你是通过下载源代码的方式使用 @vant/weapp，请将路径修改为项目中 @vant/weapp 所在的目录。

// app.json
"usingComponents": {
  "van-button": "@vant/weapp/button"
}

3.使用组件
引入组件后，可以在 wxml 中直接使用组件

<van-button type="primary">按钮</van-button>

ml
按钮