微信小程序项目使用npm安装vant-weapp的正确步骤,简单易懂!!
微信小程序项目使用npm安装vant-weapp的正确步骤
1、在当前小程序项目目录
npm init -y 构建npm项目
2、运行命令 npm install vant-weapp -S --production
安装完 发现在当前小程序目录下新增node_modules目录 下面有了vant-weapp组件文件夹 如下图:

3、详情里面:选中使用npm模块
4、进入微信开发工具:选择 工具 -> 构建npm
5、下面以引入button组件到某页面为例子:
在此页面的.json中配置
"usingComponents": {
"van-button": "../../miniprogram_npm/vant-weapp/button/index"
},
然后在此页码的wxml中
<van-button type="default">默认按钮</van-button>
<van-button type="primary">主要按钮</van-button>
<van-button type="info">信息按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>

重新编译项目 发现 已经正常引用了!!
简单易懂的操作 喜欢的朋友们可以关注一下 Jason
兄弟姐妹们,点波关注吧,一起分享有趣的技术!
掘金: https://juejin.cn/user/3034307824456296/posts 全部原创好文
CSDN: https://blog.csdn.net/qq_42753705?type=lately 全部原创好文
segmentfault 思否: https://segmentfault.com/u/jasonma1995/articles 全部原创好文
博客园 :https://www.cnblogs.com/Jason1995/ 全部原创好文
微信小程序项目使用npm安装vant-weapp的正确步骤,简单易懂!!的更多相关文章
- 微信小程序(二十)-UI组件(Vant Weapp)-01按装配置
1.官网 https://vant-contrib.gitee.io/vant-weapp/#/intro https://gitee.com/vant-contrib/vant-weapp 2.按装 ...
- 微信小程序(二十)-UI组件(Vant Weapp)-02使用
1.按钮使用 https://vant-contrib.gitee.io/vant-weapp/#/button 1.全局引入,在app.json中引入组件 "usingComponents ...
- 《微信小程序项目开发实战:用WePY、mpvue、Taro打造高效的小程序》(笔记1)WePY开发环境的安装
WePY的安装或更新都通过npm进行,全局安装或更新WePY命令行工具,使用以下命令: npm install wepy-cli -g 稍等片刻,成功安装后,即可创建WePY项目. 注意:如果npm安 ...
- 微信小程序项目转换为uni-app项目
一.它是谁? [miniprogram-to-uniapp]转换微信小程序"项目为uni-app项目.原则上混淆过的项目,也可以进转换,因为关键字丢失,不一定会完美. 二.它的原理是什么? ...
- 微信小程序项目开发实战:用WePY、mpvue、Taro打造高效的小程序》(笔记4)支持React.js语法的Taro框架
Taro本身实现的情况类似于mpvue,mpvue的未来展望中也包含了支付宝小程序,现在的版本中,也可以使用不同的构建命令来构建出百度小程序的支持,如第10章所示,但是现在Taro先于mpvue实现了 ...
- 微信小程序开发01 --- 微信小程序项目结构介绍
一.微信小程序简单介绍: 微信官方介绍微信小程序是一个不需要下载安装就可使用(呵呵,JS代码不用下载吗?展示的UI不用下载吗?)的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用. ...
- 高仿Readhub小程序 微信小程序项目【原】
# News #### 项目介绍微信小程序项目涉及功能 https://gitee.com/richard1015/News https://github.com/richard1015/News 高 ...
- 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理
[微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...
- 微信小程序中使用 npm包管理 (保姆式教程)
打开自己的微信小程序项目,在勾选这个选项 然后在第一次应该是失败的提示"没有找到可以构建的npm包". 在 小程序的根目录下比如我的项目如图: 右击鼠标在终端中打开. 然后输入:n ...
随机推荐
- centos7系列的网络yum源配置
因为新安装centos机器yum比较旧,主要是对网易源进行配置,其它源也差不多.我是在securecrt远程ssh工具操作的,非虚拟机软件上. yum install lszrz -y 安装上传工 ...
- halcon基础算子介绍(窗口创建,算子运行时长,是否启用更新函数)
前言 halcon有有大约1500个算子,我总结一些简单大家用得到的算子,比如创建窗口的方式有3种,接下来结束这方式,及其异同点等! 1.窗口创建的三种方式 1.1使用dev_open_window算 ...
- [atARC063F]Snuke's Coloring 2
首先,可以通过将所有$x_{i}=0$都选择第1类,其余选第2类,构造出一个以$(0,0)$和$(1,h)$为左下角和右上角的矩形,答案即为$2h+2$,类似地还可以构造出$2w+2$ 若最终的矩形不 ...
- 实用QPS和TPS高的高效分析方法
现在主库的MySQL的QPS一直在3K/s左右,想知道其到底执行了那些SQL,或者是那些SQL执行的次数比较多: 腾讯云的后台监控: 开启腾讯云的SQL审计后,下载几分钟SQL日志文件, 下列语句在M ...
- CF1354F Summoning Minions
考虑我们一定是先放我们选定了\(m\)个数,一定是先放了\(m-1\)个数上去,然后让放上一个不打算选的然后拿下来,白嫖\(b * (m-1)\)的贡献,最后放上一个打算放的. 考虑我们一定是按\(b ...
- 【AGC板刷记录】
这个帖子,是在自己学知识点累了的时候就看看\(AGC\)的题目来休息. 而且白天上课可以做( AGC-001 \(A\ BBQ Easy\) 考虑从小到大排,相邻两个取为一对. BBQ Easy #i ...
- Qtree V
lmn u 表示 u 所在splay子树最上方点距离最近的白点 rmn u 表示 u 所在splay子树最下方点距离最近的白点 开一个set维护所有虚儿子能走到的最近的白点的距离 考虑pushup, ...
- 问题记录:SNP 标记 phasing
GATK4 检测的SNP标记,有些位点会在检测过程中完成 phasing,在后续做基因型填充的时候有坑. GATK4 phasing 结果的缺失位点不是 ./. 也不是 .|. 而是直接变成一个单独 ...
- Yarn 生产环境核心配置参数
目录 Yarn 生产环境核心配置参数 ResourceManager NodeManager Container Yarn 生产环境核心配置参数 ResourceManager 配置调度器 yarn. ...
- Learning Spark中文版--第四章--使用键值对(2)
Actions Available on Pair RDDs (键值对RDD可用的action) 和transformation(转换)一样,键值对RDD也可以使用基础RDD上的action(开工 ...