1、打开微信开发者工具
2、新建项目,选择小程序
3、构建好项目之后:
在工具右上角点击详情按钮,打开项目的配置:选择本地设置
勾选es5 和使用npm模块构建
4、在终端进入项目根目录:
执行npm init 命令对项目初始化数据进行基本的设置
5、安装weapp:
npm i @vant/weapp -S --production
6、修改挨app.json
去掉: "style": "v2"
7、修改project.config.json:
{
"setting": {
"packNpmManually": true,
"packNpmRelationList": [
{
"packageJsonPath": "./package.json",
"miniprogramNpmDistDir": "./"
}
]
}
}
8、工具构建: 工具——》构建npm。 完成项目的构建
9、测试:
在app.json中配置测试组件:
"usingComponents": { "van-button": "@vant/weapp/button/index" }
在index.wxml中配置
<van-button type="primary">按钮</van-button>
刷新页面,如果有按钮显示出来标明使用weapp成功