vant开发微信小程序安装以及简单使用教程

更新时间：2022年12月24日 14:09:33 作者：Nanchen_42

这篇文章主要介绍了vant开发微信小程序安装以及简单使用教程,需要的朋友可以参考下

准备工作

首先准备一个空文件夹，新建微信小程序，把文件夹路径引入，删除index.wxml,index.wxss以及index.js中的文件内容

删除完毕后重新初始化index.js，在页面中输入page

对外围的文件夹进行初始化

接下来就是在文件夹下的目录中调出控制台输入以下命令

npm init -y

第一步：使用以下命令进行配置

npm i @vant/weapp -S --production

安装完成后出现一个node_modules文件夹就算成功了

第二步：删除app.json中的"style":"v2"

第三步：在详情中基本配置中勾选npm模块

第四步：点击工具——>构建npm

构建成功即可

到此为止项目就已经安装完毕了

接下来就是如何用vant

比如这里用按钮控件就必须先引入按钮的配置

app.json是全局的，index.json只对当前文件有用

效果显示如下：

比如还想引入单元格样式

以上就是vant开发微信小程序安装以及简单使用教程的详细内容，更多关于vant开发微信小程序的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:

vue 禁止重复点击发送多次请求的实现
本文主要介绍了vue 禁止重复点击发送多次请求的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2023-03-03
Vue中created和mounted使用详解
Vue中生命周期包括多个阶段,如created和mounted,每阶段有特定钩子函数,生命周期与浏览器渲染过程密切相关,了解这些可以优化页面渲染和数据处理,created阶段适用于数据初始化,而mounted阶段适合进行DOM操作和页面渲染后的处理
2024-10-10
vue项目实现点击目标区域之外可关闭(隐藏)目标区域
这篇文章主要介绍了vue项目实现点击目标区域之外可关闭(隐藏)目标区域，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2022-03-03
vue实现无缝滚动手摸手教程
这篇文章主要为大家介绍了vue实现无缝滚动手摸手教程示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-03-03
解决antd 下拉框 input [defaultValue] 的值的问题
这篇文章主要介绍了解决antd 下拉框 input [defaultValue] 的值的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2020-10-10
教你使用vue-cli快速构建的小说阅读器
这篇文章主要介绍了vue-cli构建的小说阅读器，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
2019-05-05
vue 点击按钮路由跳转指定页面的实现方式
这篇文章主要介绍了vue 点击按钮路由跳转指定页面的实现方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2022-04-04
vue-cli整合vuex的时候,修改actions和mutations,实现热部署的方法
今天小编就为大家分享一篇vue-cli整合vuex的时候,修改actions和mutations,实现热部署的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-09-09
浅谈vuex 闲置状态重置方案
本篇文章主要介绍了vuex 闲置状态重置方案，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2018-01-01
Vue学习之组件用法实例详解
这篇文章主要介绍了Vue学习之组件用法,结合实例形式分析了vue.js组件的使用流程、模板、父子组件、插槽slot等相关原理与操作技巧,需要的朋友可以参考下
2020-01-01