小程序中使用别人开发的组件,需要借助node npm 等工具,从而让组件开发具备工程化和模块化。 以有赞的 vant-weapp 为例一下是具体步骤
1、桌面创建小程序项目 demo 在开发工具中打开
2、打开项目目录 在地址栏中输入 cmd 打开我们的命令行终端 (项目名称必须符合命名规则)
3、项目初始化 npm init -y 回车 在项目目录下会出现一个 package.json 的文件
4、下载 vant-weapp 框架 https://github.com/youzan/vant-weapp
- npm i vant-weapp -S --production 这个是安装 0.x版本
-
npm i @vant/weapp -S --production 安装最新版本
5、构建小程序 npm
- 打开小程序开发工具,找到工具选项,点击构建npm (等待)
- 击开发工具中的详情-->本地设置----->勾选使用npm
6、项目根目录下会出现一个 miniprogram_npm 的文件夹
7、使用第三方组件
- 打开miniprogram_npm文件夹----@vant-----weapp 文件夹下的所有组件都可使用
- 在page-----index.json中注册 注意:两种路径都可以成功引入 "VantCheckbox" : "@vant/weapp/checkbox" 和 "VantCheckbox" : "../../miniprogram_npm/@vant/weapp/checkbox"
- 在 index.wxml中使用