uniapp-ui的使用

个人成长 | 独立开发者 | 创业历程 | 赚钱思维
大家好,我是一名独立开发者。在这里跟大家分享独立开发日常,编程技巧。欢迎大家跟我交流软件开发的一切事情,更欢迎大家下载使用我们的APP。

uni-ui 是DCloud提供的一个跨端ui库,它是基于vue组件的、flex布局的、无dom的跨全端ui框架。

这是uniapp官方提供的一套UI组件,性能是杠杠的,开发过程中的利器。

在使用uniapp-ui之前需要检测一下你的电脑中是否已经安装了node环境。

在开发工具中先把终端功能安装下来。输入node -v查看当前是否已经了node开发环境,如果识别不了node命令说明你的电脑还没有安装nodejs开发环境,如果如下图所示说明已经正确安装了node开发环境。

安装uniapp-ui需要用到npm命令来安装。准备就绪后就可以开始安装uniapp-ui

在终端输入

npm i @dcloudio/uni-ui

然后等待命令执行,成功安装后在你项目中会多一个 node_modules 目录,点击可以看到当前的目录结构。

这样就成功安装了uniapp-ui ,接下来就是在项目中进行配置。

在项目的配置文件page.json中添加 easycom节点,这是他们官方的配置。

        "easycom": {
			"autoscan": true,
			"custom": {
				// uni-ui 规则如下配置
				"^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue"
			}
		},

至此,已经完成了全部的工作了,可以愉快的使用的uniapp-ui啦!

------------------ 华丽分割线 ------------------
创业举步维艰,感谢各位支持
欢迎大家阅读我的创业笔记,如果你觉得这篇写得不错的话,可以关注我的公众号: 成长创业笔记 第一时间查阅我们的文章!感谢大家的支持。
欢迎大家下载使用我们的安卓APP:
  • ● 松鼠驾考:驾考刷题APP,新版的驾考题目内容持续更新。
  • ● 松鼠天气:简洁的天气预报,日历工具
  • ● 加我微信:zstxinghui
成长创业笔记
程序员小张
我们的主营业务:承接网站建设小程序开发安卓APP开发软著申请等。欢迎咨询!
扫一扫,加我微信
随机文章
开发者周记5:今天小木CMS终于上线网站手机版本
2024-06-16 17:13:05
在移动互联网时代,网站依然是非常好的一个商业模式
2024-06-27 10:55:28
uniapp使用vue3实现tab切换效果
2024-07-27 14:36:05
关于我们的产品
2024-08-27 16:59:04
vue3状态管理pinia踩过的坑
2025-03-14 10:48:58