微信小程序引入Vant组件库
前期准备
Vant Weapp组件库:https://youzan.github.io/vant-weapp/#/intro
1.先在微信开发者工具中打开项目的终端:
然后初始化一个package.json文件:输入命令:npm init
然后一路回车默认的即可:
npm init
项目就回产生一个package.json文件:
{
"name": "miniprogram",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
2.接着在vant组件库的官网上找到安装语句:
npm i vant-weapp -S --production,在终端输入安装命令,点击回车:
npm i vant-weapp -S --production
3.构建npm:
在微信开发者工具的菜单栏中找到工具栏的选项“构建npm”,等待构建完成
4.引用和使用vant组件:
(关于如何引用和使用组件可以参考官方文档噢,很齐全)
以引用button按钮为例,官网文档中都写的特别详细了:
微信小程序引入Vant组件库的更多相关文章
- uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤
uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤 这里以vant-weapp为例 uni-app官方文档介绍引入组件的方法 1. 新建相关目录 根目录下创建 wxcomponen ...
- 微信小程序引入ECharts组件
首先打开ECharts网页 https://echarts.apache.org/zh/tutorial.html#%E5%9C%A8%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8 ...
- 微信小程序引入外部组件 iView Weapp
iview Weapp组件的使用方法: 1. 下载小程序组件库 (前提是你已经有了项目目录) 你可以直接去github把iView Weapp的代码下载下来,也可以用过npm来下载. github地址 ...
- 微信小程序中的组件使用1
不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...
- 微信小程序--页面与组件之间如何进行信息传递和函数调用
微信小程序--页面与组件之间如何进行信息传递和函数调用 这篇文章我会以我自己开发经验从如下几个角度来讲解相关的内容 页面如何向组件传数据 组件如何向页面传数据 页面如何调用组件内的函数 组件如何调 ...
- 原创:WeZRender:微信小程序Canvas增强组件
WeZRender是一个微信小程序Canvas增强组件,基于HTML5 Canvas类库ZRender. 使用 WXML: <canvas style="width: 375px; h ...
- 微信小程序之swiper组件高度自适应
微信小程序之swiper组件高度自适应 要求: (顶部广告栏 ) 改变swiper组件的固定高度,使之随内部每张图片的高度做自适应 原理: 图片加载完之后,获取图片的原始宽高,根据宽高比,计算出适应后 ...
- 微信小程序基于swiper组件的tab切换
代码地址如下:http://www.demodashi.com/demo/14010.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...
- 微信小程序引入md5.js
今天给大家安利一下微信小程序引入md5.js的方法,不多说 md5.js在下面 直接复制到项目的utils/md5.js即可 /* * A JavaScript implementation of t ...
随机推荐
- mysql 逻辑运算符
NOT! 逻辑非. 如果操作数为 0,返回 1:如果操作数为非零,返回 0:如果操作数为 NOT NULL,返回 NULL. mysql> SELECT NOT 10; -> 0 mysq ...
- Java开发笔记(一百二十六)Swing的窗口
前面介绍了AWT界面编程的若干技术,在编码实践的时候,会发现AWT用起来甚是别扭,它的毛病包括但不限于下列几点:1.对中文的支持不好,要想在界面上正常显示汉字,还得在运行时指定额外的运行参数“-Dfi ...
- Select与Epoll的区别
相同点: 都是IO多路转接,都是一个线程能同一时间等待一堆描述符 不同点: 1.select接口使用不方便,每次调用完select都需要重新设置fd_set,因为输入输出未分离,返回的fd_set ...
- Log4J对系统性能的影响
Log4J对系统性能的影响 主要体现: 1.日志输出的目的地,输出到控制台的速度比输出到文件系统的速度要慢. 2.日志输出格式不一样对性能也会有影响,如简单输出布局(SimpleLayout)比格式化 ...
- Hadoop之MapReduce流程
hadoopMapReduce 1. MapReduce流程 2. Shuffle流程 1. MapReduce流程 MapReduce流程 切片: 对数据进行逻辑划分,默认大小是一个block块大小 ...
- Flutter 与 Android 的交互
https://juejin.im/post/5cd91de4518825686b120921 https://juejin.im/entry/5b64292be51d451995676398
- MQ相关
1. 如何保证消息按顺序执行 2. 如何保证消息不重复消费 3. 如何保证消息不丢失 4.RabbitMQ Java Client简单生产者.消费者代码示例
- 【转载】ASP.NET网站选购阿里云服务器的时候,阿里云账号个人认证以及企业认证有何不同
在采购阿里云产品,如阿里云云服务器.阿里云短信包.阿里云数据库MySql以及Sqlserver.阿里云对象存储OSS等云产品的时候,如果账号未进行实名认证,很多时候会要求实名认证操作,在实名认证时可选 ...
- C# 将Excel导出PDF
1.安装所需包,使用nuget安装所需包 1.1.Spire.Xls 1.2.iTextSharp.text.pdf 2.Spire.Xls介绍 将Excel转换为PDF是一个很常用的功能,常见的转换 ...
- ArrayList集合实现RandomAccess接口有何作用?为何LinkedList集合却没实现这接口
详见:https://blog.csdn.net/weixin_39148512/article/details/79234817 众所周知,在List集合中,我们经常会用到ArrayList以及Li ...