vant Webapp 快速使用

Vant Weapp 是移动端 Vue 组件库 Vant 的小程序版本，两者基于相同的视觉规范，提供一致的 API 接口，助力开发者快速搭建小程序应用。(对不不会写css或者不想写css的感觉非常好用)。

一。选取你的项目文件夹右键在终端打开

二。初始化npm并安装组件

npm init
npm i @vant/weapp -S --production

输入这两行指令，有一些需要填写的可以直接默认回车，也可以填写。

三。开发工具构建npm和使用

点击上方菜单栏工具，构建npm

点击右上角详情勾选使用npm

四。修改 app.json
将 app.json 中的 “style”: “v2” 去除，小程序的新版基础组件强行加上了许多样式，难以去除，不关闭将造成部分组件样式混乱。

五。使用vant webapp组件
在app.json或者其他页面的json文件中配置usingComponents就能使用。

vant Webapp 快速使用相关推荐

Vant Webapp步骤表单
Vant webApp步骤表单文章目录 Vant webApp步骤表单一.前言二.预览三.代码 1.shareApplication.js 2.shareApplication.json 3. ...
微信小程序 vant webapp开发
一.简介 vant 官网 https://youzan.github.io/vant-weapp/#/home 最近开发微信小程序使用 vant 过程中按照官网步骤没有成功,特此记录二.环境说明开 ...
有赞Vant webapp步骤条组件插入组件icon
1.json文件引入组件 2.查看用法 3.步骤条组件中插入icon组件附有赞组件库:https://vant-contrib.gitee.io/vant-weapp/#/button
Vant 1.0 发布：轻量、可靠的移动端 Vue 组件库
Vant 是有赞前端团队维护的移动端 Vue 组件库,提供了一整套 UI 基础组件和业务组件.通过 Vant 可以快速搭建出风格统一的页面,提升开发效率. Vant 一.关于 1.0 距离 Vant ...
微信小程序使用vant weapp报错
微信小程序使用vant weapp报错错误一:构建错误错误二:["usingComponents"]["van-button"] 未找到我的安装流程 1. ...
vant weapp在小程序自定义tabbar
1.首先在小程序根目录miniprogram文件夹下创建 custom-tab-bar 文件夹包含 index.js index.json index.wxml 其中index.js文件内容注 ...
「Vueconf」探索 Vue3 中的 JSX
大家好,我是若川.今天再分享 Vueconf 的一篇文章.另外 Vueconf 主办方提供的录播链接是: https://www.bilibili.com/read/mobile?id=1140869 ...
基于Vue的微信公众号开发及选型研究
目录 1.背景介绍 1.1微信公众号简介 1.2Vue框架简介 1.3组件库简介 2.开发流程 2.1申请微信公众号 2.2申请微信测试号及配置 2.3安装微信开发者工具 2.4创建Vue项目 2.5 ...
微信小程序开发--首页及详情页开发
一.常用组件在之前的封装请求数据的模块中请求轮播图的数据 1.首页轮播图数据的请求以及渲染 1.轮播图数据的请求pages/index/index.js data: {bannerlist:[] / ...

vant Webapp 快速使用

vant Webapp 快速使用

vant Webapp 快速使用相关推荐

最新文章

热门文章