vue中如何按需引入vant

news/2024/7/10 0:24:47 标签: vue

vuevant_0">vue中如何按需引入vant

1.通过npm或者cnpm安装

npm i vant -S 或者 cnpm i vant -S

2.安装插件

npm i babel-plugin-import -D

3.然后在.babelrc.config.js 中添加配置 样式按需加载

{
  "plugins": [
    ["import", {
      "libraryName": "vant",
      "libraryDirectory": "es",
      "style": true
    }]
  ]
}

4.在src这个文件下面,创建一个plugins文件夹,里面创建一个vant.js文件,里面引入需要的组件,然后通过Vue.use引入到全局,

// 按需全局引入 vant组件
import Vue from 'vue'
import { Button, List, Cell, Tabbar, TabbarItem } from 'vant'
Vue.use(Button)
Vue.use(Cell)
Vue.use(List)
Vue.use(Tabbar).use(TabbarItem)

5.最后需要把这个js文件引入到app.js全局里面才生效,这样就可以使用啦


http://www.niftyadmin.cn/n/1836136.html

相关文章

在Spring.Net中利用NHibernate配置增加二级缓存

先上这样的一段系统配置&#xff1a; 代码 <!--NHibernate配置 开始 --><object id"NHibernateSessionFactory"type"Xino.Spring.DecryptLocalSessionFactoryObject, Xino.Core.Spring"><property name"DbProviderWithDecrypt"re…

讲解RedHat Linux 5显示中文的方法

Linux越来越流行&#xff0c;你对Linux了解了么&#xff1f;安装的RedHat Linux 5在打开浏览器时&#xff0c;中文显示为方块&#xff0c;该如何解决&#xff1f;本文为你详细介绍RedHat Linux 5显示中文&#xff0c;为你在学习RedHat Linux 5显示中文时起一定的作用。或者是在…

微信小程序上拉加载流程

微信小程序上拉加载流程 1.首先需要在微信官方文档把scroll-view这个方法引入进来&#xff0c;然后使用这个方法&#xff0c;在样式里面写scroll-y&#xff0c;代表的是上下滑动&#xff0c;然后给滑动的盒子一个高度&#xff0c;100vh&#xff0c;然后开启bindscrolltolower这…

【转载】你真的懂我吗?(谈谈C#接口)之一

写的真的很好……学习了&#xff0c;也希望更多人能看到 http://www.cnblogs.com/sifang2004/archive/2006/07/14/450565.html 谈谈C#中的接口 接口的相关陈述 &#xff11;&#xff0e;一个接口定义了一个契约。 &#xff12;&#xff0e;接口可以包容方法、C#属性、事件、以及…

配置优化nginx处理PHP的请求

第一步&#xff1a;接受请求&#xff0c;发现是PHP请求&#xff0c;转向第二步。 第二步&#xff1a;通过socket的方式&#xff0c;连接PHP-FPM的fast-cgi,让PHP-FPM处理请求。 第三步&#xff1a;获得PHP-FPM处理结果&#xff0c;加上http报头&#xff0c;返回给客户端。 所…

忘记adminstrator密码后,如何恢复的方法

忘记xp密码怎么办&#xff1f; 进行下面试验前&#xff0c;必须确认自己有这台电脑的使用权&#xff0c;并且WindowsXp的安装分区不是NTFS格式&#xff0c;最好能添加几个可使用的用户。 方法一 第一步&#xff1a; 用DOS启动盘启&#xff08;如98启动盘&#xff09;动电脑&…

ERP框架开发中的License许可验证机制设计与实现 (包含源代码下载)

许可机制是ERP框架中必不可少的一部分&#xff0c;可以有效的保护框架资源在授权范围内应用&#xff0c;增加企业投资的回报。在研究了几种类型的许可机制(序列号注册码&#xff0c;Web服务联机验证&#xff0c;授权License文件)后&#xff0c;最后选定以Signed Xml配合RSA算法…

js基础总和

js基础总和 1.基本数据类型和引用数据类型的区别 1.1&#xff1a;基本类型赋值的时候就是各跟各的&#xff0c;互不干扰&#xff0c;而引用类型赋值的时候会跟着变量一起改变 1.2&#xff1a;举个例子&#xff1a;基本类型&#xff0c;变量从新赋值&#xff0c;而值不会改变 …