UI库的按需加载(vue的问题)

为什么要使用按需加载的方式而不是一次性全部引入,原因就不多说了。这里以vant的按需加载为例,演示vue中ui库怎样进行按需加载:

  • 安装:cnpm i vant -S
  • 安装babel-plugin-import插件使其按需加载:cnpm i babel-plugin-import -D
  • 在 .babelrc文件中中添加插件配置 :
libraryDirectory {"plugins": [// 这里是原来的代码部分// …………// 这里是要我们配置的代码["import",{"libraryName": "vant","libraryDirectory": "es","style": true}]]
}

在main.js中按需加载你需要的插件:

// 按需引入vant组件
import {DatetimePicker,Button,List
} from 'vant';

使用组件:

// 使用vant组件
Vue.use(DatetimePicker).use(Button).use(List);

最后在在页面中使用:

<van-button type="primary">按钮</van-button>

ps:出来vant库外,像antiUielementUi等,很多ui库都支持按需加载,可以去看文档,上面都会有提到。基本都是通过安装babel-plugin-import插件来支持按需加载的,使用方式与vant的如出一辙,可以去用一下。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/614886.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Python】编程练习的解密与实战(三)

​&#x1f308;个人主页&#xff1a;Sarapines Programmer&#x1f525; 系列专栏&#xff1a;《Python | 编程解码》⏰诗赋清音&#xff1a;云生高巅梦远游&#xff0c; 星光点缀碧海愁。 山川深邃情难晤&#xff0c; 剑气凌云志自修。 目录 &#x1fa90;1. 初识Python &a…

Tensorflow和飞桨Paddle的控制流算子设计

一、概览 注&#xff1a;整体方案上尚存在技术疑点&#xff0c;需进一步小组内讨论对齐&#xff0c;避免方案设计上存在后期难以扩展&#xff08;或解决&#xff09;的局限性 框架TensorFlow 1.xTensorFlow 2.xPaddlecond/while√√√实现机制组合OP (DataFlow)函数式 (Functio…

Alphalens因子分析(4) - Information Coefficient方法

在前面的笔记中&#xff0c;无论是回报分析&#xff0c;还是因子Alpha&#xff0c;它们都受到交易成本的影响。信息分析 (Information Analysis)则是一种不受这种影响的评估方法&#xff0c;主要研究方法就是信息系数(Information Coefficient)。 信息系数的范围为-1到1&#x…

解决大模型的幻觉问题:一种全新的视角

在人工智能领域&#xff0c;大模型已经成为了一个重要的研究方向。然而&#xff0c;随着模型规模的不断扩大&#xff0c;一种新的问题开始浮出水面&#xff0c;那就是“幻觉”问题。这种问题的出现&#xff0c;不仅影响了模型的性能&#xff0c;也对人工智能的发展带来了新的挑…

linux 02 vmware的快照,文件管理

01.快照 使用快照&#xff1a; 同时的快照管理器&#xff1a; 如果想要返回快照&#xff0c;选择要选择的快照&#xff0c;跳转 02. 文件管理&#xff1a; cd 修改当前路径 02.touch 创建文件 03. mkdir 创建文件夹 mkdir -p 文件夹 &#xff08;创建之前没有的上级文件…

leetcode面试经典150题——50 快乐数

题目&#xff1a;快乐数 描述&#xff1a; 编写一个算法来判断一个数 n 是不是快乐数。 「快乐数」 定义为&#xff1a; 对于一个正整数&#xff0c;每一次将该数替换为它每个位置上的数字的平方和。 然后重复这个过程直到这个数变为 1&#xff0c;也可能是 无限循环 但始终变…

微软Visual Studio产品之Visual C++编程进阶——一维数组(画画版)

我是荔园微风&#xff0c;作为一名在IT界整整25年的老兵&#xff0c;看到不少初学者在学习编程语言的过程中如此的痛苦&#xff0c;我决定做点什么&#xff0c;我小时候喜欢看小人书&#xff08;连环画&#xff09;&#xff0c;在那个没有电视、没有手机的年代&#xff0c;这是…

聚乙烯PE的特性有哪些?UV胶水能够粘接聚乙烯PE吗?

聚乙烯&#xff08;Polyethylene&#xff0c;PE&#xff09;是一种聚合物&#xff0c;是由乙烯&#xff08;ethylene&#xff09;单体通过聚合反应形成的合成塑料。以下是聚乙烯的一些主要化学特性&#xff1a; 1.化学式&#xff1a; 聚乙烯的基本化学式是 (C2H4)n&#xff0c;…

回归预测 | Matlab基于SO-BiLSTM蛇群算法优化双向长短期记忆神经网络的数据多输入单输出回归预测

回归预测 | Matlab基于SO-LSTM蛇群算法优化长短期记忆神经网络的数据多输入单输出回归预测 目录 回归预测 | Matlab基于SO-LSTM蛇群算法优化长短期记忆神经网络的数据多输入单输出回归预测效果一览基本介绍程序设计参考资料 效果一览 基本介绍 1.Matlab基于SO-BiLSTM蛇群算法优…

asyn await promise例子了解基本用法

以下是一个简单的示例&#xff0c;演示了如何使用async和await来异步处理数据&#xff1a; 假设我们有一个函数&#xff0c;它需要从远程服务器获取数据。我们可以使用async和await来异步地处理这个请求&#xff0c;这样不会阻塞程序的执行。 async function fetchData() { t…

读《Open-Vocabulary Video Anomaly Detection》

2023 西北工业大学和新大 引言 视频异常检测(VAD)旨在检测不符合预期模式的异常事件&#xff0c;由于其在智能视频监控和视频内容审查等应用前景广阔&#xff0c;已成为学术界和工业界日益关注的问题。通过几年蓬勃发展&#xff0c;VAD 在许多不断涌现的工作中取得了重大进展。…

Jenkins+nexus

jiekins安装完成 1、安装java环境 [rootnexus ~]# tar -xf jdk-8u211-linux-x64.tar.gz -C /usr/local [rootnexus ~]# vim /etc/profile.d/java.sh JAVA_HOME/usr/local/jdk1.8.0_211 PATH$PATH:$JAVA_HOME/bin [rootnexus ~]# source /etc/profile.d/java.sh 必须要选择与n…

Linux笔记之右上角的网络连接图标的IP是本机IP还是远程主机的IP

Linux笔记之右上角的网络连接图标的IP是本机IP还是远程主机的IP? code review! 文章目录 Linux笔记之右上角的网络连接图标的IP是本机IP还是远程主机的IP?问题一&#xff1a;Linux笔记之右上角的网络连接图标上面的IP是本机IP还是远程主机的IP&#xff1f;问题二&#xff1…

Opencv 编译

文章目录 版本编译 版本 opencv 3.4 编译 # 下载代码 git clone https://github.com/opencv/opencv.git git clone https://github.com/opencv/opencv_contrib.git # 扩展包&#xff0c;不需要可省略相关步骤 # 版本切换 cd opencv git checkout 3.4.0 --force cd ../opencv…

PDF-XChange Editor v10.2.0.384

软件介绍 PDF-XChange Editor&#xff0c;号称打开速度最快最强大的PDF编辑器/PDF阅读器&#xff0c;PDF-XChange专注于PDF文档的编辑&#xff0c;打开PDF文件速度快&#xff0c;软件小功能强大&#xff0c;可以自定义制作PDF电子文档&#xff0c;具有创建&#xff0c;查看&am…

解密Path环境变量

解密Path环境变量 大家好&#xff0c;我是免费搭建查券返利机器人赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01;今天&#xff0c;让我们一起深入探讨程序开发中不可或缺的一项关键技术——“path环境变量”。无论…

Rust变量、常量声明与基本数据类型

Rust是一门系统级别的编程语言&#xff0c;注重安全性、性能和并发。在这篇博客中&#xff0c;我们将介绍Rust中的变量、常量声明以及基本数据类型&#xff0c;并通过示例说明每一种类型的用法。 变量声明 在Rust中&#xff0c;使用 let 关键字声明变量。变量默认是不可变的&…

大学物理-实验篇(二)——用分光计测定三棱镜的折射率(光:特定频段电磁波、光线在介质界面折射、平行光与凸透镜)

目录 预备知识 光&#xff1a;特定频段电磁波 光线在介质界面折射 平行光与凸透镜 实验目的 实验仪器 实验原理 实验步骤 准备分光计 目镜调焦 刻度盘读数 测三棱镜顶角 测三棱镜最小偏向角 数据处理 预备知识 光&#xff1a;特定频段电磁波 光速&#xff1a;…

【REST2SQL】08 日志重构增加输出到文件log.txt

【REST2SQL】01RDB关系型数据库REST初设计 【REST2SQL】02 GO连接Oracle数据库 【REST2SQL】03 GO读取JSON文件 【REST2SQL】04 REST2SQL第一版Oracle版实现 【REST2SQL】05 GO 操作 达梦 数据库 【REST2SQL】06 GO 跨包接口重构代码 【REST2SQL】07 GO 操作 Mysql 数据库 原来…

leetcode每日一题44

130. 被围绕的区域 图论 dfs/bfs dfs代码框架 void dfs(参数) {if (终止条件) {存放结果;return;}for (选择&#xff1a;本节点所连接的其他节点) {处理节点;dfs(图&#xff0c;选择的节点); // 递归回溯&#xff0c;撤销处理结果} }思路&#xff1a;本题要求找到被x围绕的陆…