uniapp初步搭建:如何引入uview库(跨移动多端ui库)

news2025/1/17 18:04:33

uView是uni-app生态专用的UI框架,uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码, 可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台(引言自uni-app网)


1. 查看项目根目录有没有package.json,如果没有执行一下命令:

npm init -y

2. 安装

npm install uview-ui@2.0.31 

3.在uniapp项目的main.js文件里引入

import uView from "uview-ui";

Vue.use(uView); 

4.uniapp项目的uni.scss文件下引入

@import 'uview-ui/theme.scss';

5.在App.vue中首行的位置引入,注意:给style标签加入lang="scss"属性

<style lang="scss">
/* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
@import "uview-ui/index.scss";
</style>

6.pages.json文件里进行配置,添加easycom属性

{
"easycom": {
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
},

// 此为本身已有的内容
"pages": [
// ......
]
}

7.最后在vue单文件的html层就可以直接使用uview组件了


作者上一篇文章,

uniapp踩坑之小程序:手机进入微信小程序出现白屏_意初的博客-CSDN博客​在微信公众平台​ =》版本管理=》修改路径,即可。https://blog.csdn.net/weixin_43928112/article/details/127887644

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

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

相关文章

公钥密码学中的公钥和私钥

公钥密码学解释&#xff1a;它是什么&#xff1f; 公钥基础设施 (PKI) 用于管理互联网通信中的身份和安全性。 启用 PKI 的核心技术是公钥密码术&#xff0c;这是一种依赖于使用两个相关密钥&#xff08;公钥和私钥&#xff09;的加密机制。 这两个密钥一起用于加密和解密消息。…

CM311-3_YST_晨星MSO9385_2+8_安卓9.0_TTL免费升级固件【含教程】

新魔百盒CM311-3_YST_晨星MSO9385_28_安卓9.0_TTL免费升级固件【含教程】 固件特点&#xff1a; 1、修改dns&#xff0c;三网通用&#xff1b; 2、开放原厂固件屏蔽的市场安装和u盘安装apk&#xff1b; 3、无开机广告&#xff0c;无系统更新&#xff0c;不在被强制升级&…

网站攻击技术,一篇打包带走!

大家好&#xff0c;今天给大家介绍一下&#xff0c;Web安全领域常见的一些安全问题。 1. SQL 注入 SQL注入攻击的核心在于让Web服务器执行攻击者期望的SQL语句&#xff0c;以便得到数据库中的感兴趣的数据或对数据库进行读取、修改、删除、插入等操作&#xff0c;达到其邪恶的…

分布式应用之监控平台zabbix的认识与搭建

内容预知 1.监控系统的相关知识 1.1 监控系统运用的原因 1.2 网站的可用性 1.3 市面上常用的监控系统 2.zabbix的相关知识 2.1 zabbix的概述 2.2 zabbix 是什么&#xff1f; 2.3 zabbix的监控原理 2.4 zabbix监控系统中五个常用程序 3. zabbix 服务端的部署 4. 部署…

C++ 不知图系列之基于链接表的无向图最短路径搜索

1. 前言 图的常用存储方式有 2 种&#xff1a; 邻接炬阵。 链接表。 邻接炬阵的优点和缺点都很明显。优点是简单、易理解&#xff0c;但是对于大部分图结构而言&#xff0c;都是稀疏的&#xff0c;使用矩阵存储&#xff0c;空间浪费就较大。 链接表相比较邻接矩阵存储方案…

团队的Code Review实践

高效地进行 Code Review 一直是我们想要做的事情&#xff0c;如何持续保持高效 Review 也是我们日常开发中所亟需解决的问题。 在疫情爆发之前&#xff0c;团队大多是线下一起办公。大家会聚在一起 Code Review&#xff0c;把讨论出的反馈记录在便利贴并贴在白板上。而当远程、…

Baklib|如何为你的营销计划制作Wiki页面

当你需要快速查找信息时&#xff0c;你会怎么做?很有可能&#xff0c;你会直接去谷歌——在输入你的查询之后&#xff0c;十有八九&#xff0c;搜索引擎会带你去wiki百科。wiki百科是一个巨大的在线百科全书。在这个数据库中&#xff0c;几乎所有的文章都有链接。 现在想象一…

Maven之POM介绍

POM介绍前言POM基础为什么要学习POM什么是POMSuper POMMinimal POM&#xff08;POM的最低配置&#xff09;POM特点Project Inheritance(项目继承性&#xff09;Project Aggregation(项目聚合&#xff09;Project Inheritance VS Project AggregationProject Interpolation and …

《FFmpeg Basics》中文版-00-简介

欢迎 亲爱的读者们&#xff0c; 欢迎来到这本书&#xff0c;它将使您熟悉FFmpeg项目的许多有趣的特性。下面的几个大公司都是FFmpeg使用者: Facebook&#xff0c;最大的社交网络&#xff0c;用FFmpeg技术处理用户的视频。Google Chrome&#xff0c;流行的web浏览器&#xff0…

EDI通信中常用的网络排查方法

在知行之桥EDI系统运维工作中不可避免会碰到各种网络问题&#xff0c;本文将分享一些我们运维同事常用的一些网络问题排查定位方法&#xff0c;帮助大家快速的定位原因&#xff0c;解决通信问题。 1.Ping&#xff1a; 作用&#xff1a;ping用于确定本地主机是否能与另一台主机…

shell脚本下用plot给iostat和CPU的采样画图的写法

目前大多的互联网客户,在导入SSD之前&#xff0c;基本会要求OEM或者SSD厂商提供一些性能数据图&#xff0c;所以 作图也基本成了测试人员的必备技能&#xff0c;单盘的性能可以用Excel表格导入&#xff0c;但是复杂的可能会比较麻烦。就需要我们借助工具来作图了。 本篇文章简单…

第9章 Apache-Dbutils实现CRUD操作

1. Apache-DBUtils简介 *commons-dbutils 是 Apache 组织提供的一个开源 JDBC工具类库&#xff0c;它是对JDBC的简单封装&#xff0c;学习成本极低&#xff0c;并且使用dbutils能极大简化jdbc编码的工作量&#xff0c;同时也不会影响程序的性能。 *API介绍&#xff1a; org.…

java和vue的大学生奖学金助学金系统奖学金系统助学金系统

简介 大学生奖学金助学金系统。学生申请自己需要的奖助学金&#xff0c;上传证明材料。该学院的辅导员可以下载学生的证明材料以及根据学生的综合成绩来审核是否通过&#xff0c;若不通过请输入不通过原因。管理员可以导入学生excel和辅导员excel以及学生综合成绩excel、分布公…

鲲鹏代码迁移工具介绍

鲲鹏代码迁移工具介绍 代码迁移工具介绍 代码迁移工具是什么&#xff1f; ✨我们为什么会需要用到代码迁移工具&#xff1f; ✨处理器所支持的指令集不同&#xff0c;意味着开发者可能需要对代码进行跨平台的迁移。 这里我们常见到便是x86平台的代码往arm平台进行迁移 通常…

主流组件库学习

主流组件库差异性对比 NutUI - 京东研发的移动端 UI 组件库&#xff0c;支持 Vue3、Taro 多端适配&#xff0c;面向电商业务场景Vant - 有赞研发的移动端 UI 组件库&#xff0c;支持 Vue3、微信小程序、支付宝小程序TDesign Mobile - 腾讯研发的移动端组件库&#xff0c;适合在…

Redis第二章_实战篇_短信登录+缓存策略+秒杀+分布式锁>>

Redis第二章_实战篇_短信登录缓存策略秒杀分布式锁>> 文章目录Redis第二章_实战篇_短信登录缓存策略秒杀分布式锁>>开篇导读1、短信登录1.1、导入黑马点评项目1.1.1 、导入SQL1.1.2、有关当前模型1.1.3、导入后端项目1.1.4、导入前端工程1.1.5 运行前端项目1.2 、基…

Spring(十一)- Spring Bean的依赖注入注解

文章目录一、Spring Bean的依赖注入注解1. 通过Value直接注入普通属性2. 通过Value注入properties文件中的属性3. Autowired注解&#xff0c;用于根据类型进行注入4. Qualifier配合Autowired可以完成根据名称注入Bean实例&#xff0c;使用Qualifier指定名称5. Resource注解既可…

三款Zookeeper可视化工具、ZooInspector、prettyZoo、ZooKeeperAssistant

三款Zookeeper可视化工具、ZooInspector、prettyZoo、ZooKeeperAssistant①Zookeeper图形化工具&#xff1a;ZooInspector1.下载完后&#xff0c;解压压缩包&#xff0c;进入zookeeper-dev-ZooInspector.jar目录后执行run jar包命令2.登录客户端&#xff1a;输入zk服务的ip和端…

XCTF1-web disabled_button weak_auth view_source cookie backup

一个不能按的按钮 题目描述 X老师今天上课讲了前端知识&#xff0c;然后给了大家一个不能按的按钮&#xff0c;小宁惊奇地发现这个按钮按不下去&#xff0c;到底怎么才能按下去呢&#xff1f; 进入场景 题目提示为前端设置的问题&#xff0c;查看网页源码&#xff0c;定位…

Django + Nginx https部署实战(第二辑)

如何使用Nginx把网站升级为Https&#xff1f; Https是Http协议的升级版&#xff0c;由于证书的引入&#xff0c;使得用户与网站之间的通讯变得更加安全。 在使用https之前&#xff0c;我们必须了解的事情 证书颁发机构 证书颁发机构是一家知名且受信任的组织&#xff0c;它对网…