打开项目终端,初始化
npm init —— 一直回车,直到出现yes——yes——回车
安装包
npm i @vant/weapp -S --production
使用
右上角 详情==> 本地设置 ==>选中使用npm模块
顶部菜单栏 工具 -> 构建npm
修改 project.config.json
开发者工具创建的项目,miniprogramRoot 默认为 miniprogram,package.json 在其外部,npm 构建无法正常工作。需要手动在 project.config.json 内添加如下配置,使开发者工具可以正确索引到 npm 依赖的位置。
"packNpmManually": true,
"packNpmRelationList": [
{
"packageJsonPath": "./package.json",
"miniprogramNpmDistDir": "./miniprogram/"
}
]
引入组件
可以在单独页面的 .json文件中也可以在全局 app.json中
"usingComponents": {
"van-button": "@vant/weapp/button/index"
}
// 具体页面wxml中
<van-button type="primary">按钮</van-button>