小程序对npm的支持与限制

小程序中使用npm包有如下3个限制：

1. 不支持依赖于node.js内置库的包
2. 不支持依赖于浏览器内置对象的包
3. 不支持依赖于c++插件的包

vant Weapp npm包

• 安装vant组件库
  在小程序中安装vant组件库有如下3步：

1. 通过npm安装
2. 构建npm包
3. 修改app.json
   具体步骤参考vant官方文档

• 使用vant组件
  在app.json的usingComponents节点中引入需要的组件，即可在wxml中直接使用组件，示例：

"usingComponents":{
"van-button":"@vant/weapp/button/index"
}
<van-button type="primary">按钮</van-button>

• 定制全局主题样式
  在app.wxss中，写入css变量，即可对全局生效

page{
--button-danger-background-color:#c00000;
}

颜色变量参考官方配置文件

API Promise化npm包

• 实现API Promise化
  小程序中实现API Promise化主要依赖于miniprogram-api-promise这个第三方的npm包。安装使用步骤如下：

1. 安装依赖

npm install--save miniprogram-api-promise

1. 在app.js中配置:只需调用一次promisifyAll()方法即可实现一步API的Promise化

imoort {promisifyAll} from 'miniprogram-api-promise'
const wxp=wx.p={}
promisifyAll(wx,wxp)

1. 调用Promise化之后的异步API

//wxml
<van-button type="danger" bindtap="getInfo">vant按钮</van-button>
async getInfo(){
const {data:res}=await wx.p.request({
method:'GET',
url:'https://www.escook.cn/api/get',
data:{name:'zs',age:20}
})
}