小程序-uni-app:hbuildx uni-app 安装 uni-icons 及使用

简介: 小程序-uni-app:hbuildx uni-app 安装 uni-icons 及使用

一、官方文档找到uni-icons


uni-app官网


2c453e481d0129678f20151ad9158283_decd86f51b794e2f97c2048f4d209880.png


二、下载插件


9226407cffa2e1dd6f66804774badc4e_087324bc1d564a7291bbc71da449de3c.png


三、点击“打开HBuildX”


b20fc866ec5ed55cde7d3006ae273104_70d824d055c94d4e8f4d8e3d90594c5a.png


四、选择要安装的项目


c7430c571c055dbb99e00fef8bb89fde_5c1e23d92592487fb71cde589489960d.png


五、勾选要安装的插件


7f7d043189b5d7a1979456df49528986_a8a8429a59f54aa9a3eee29caa618f3a.png


六、安装后,项目插件目录


根目录uni_modules目录下增加uni-icons、uni-scss


23966d492aaa361846040becf746ab9e_f7748d8fa66d4ba390097b433f7f8c86.png


七、引入组件,使用组件


<uni-icons type="phone-filled" size="26"></uni-icons>
import uniIcons from '../../../uni_modules/uni-icons/components/uni-icons/uni-icons.vue'
components: {
        uniIcons
},


八、经过测试,成功。


c1da110a79edc649208f48dc4c3f72f2_a72386fe27ab4ed98f23d2741ad96967.png


参考链接

http://lihuaxi.xjx100.cn/news/1221122.html?action=onClick

uniapp uni-icons 组件为例 带着大家使用并熟悉一次文档 - overfit.cn



相关文章
|
1月前
|
传感器 人工智能 监控
Uni-app智慧工地数据大屏可视化监管平台源码带APP
智慧工地的核心是数字化,它通过传感器、监控设备、智能终端等技术手段,实现对工地各个环节的实时数据采集和传输,如环境温度、湿度、噪音等数据信息,将数据汇集到云端进行处理和分析,生成各种报表、图表和预警信息,帮助管理人员了解工地的实时状况,及时做出决策和调整,
49 0
|
2月前
|
API 数据安全/隐私保护 iOS开发
利用uni-app 开发的iOS app 发布到App Store全流程
利用uni-app 开发的iOS app 发布到App Store全流程
106 3
|
2月前
|
存储 小程序 API
【微信小程序】-- uni-app 项目-- 购物车 -- 首页 - 轮播图效果(五十二)
【微信小程序】-- uni-app 项目-- 购物车 -- 首页 - 轮播图效果(五十二)
【微信小程序】-- uni-app 项目-- 购物车 -- 首页 - 轮播图效果(五十二)
|
2月前
|
小程序 开发工具 git
【微信小程序】-- uni-app 项目--- 购物车 -- 配置 tabBar 效果(五十一)
【微信小程序】-- uni-app 项目--- 购物车 -- 配置 tabBar 效果(五十一)
|
2月前
|
存储 小程序 前端开发
基于APP的微信点餐小程序的设计与实现
基于APP的微信点餐小程序的设计与实现
37 3
|
2月前
|
开发框架 移动开发 小程序
【微信小程序】-- 配置uni-app的开发环境(四十八)
【微信小程序】-- 配置uni-app的开发环境(四十八)
|
1天前
|
小程序 Android开发 iOS开发
uni-app 安装与配置
uni-app 安装与配置
8 1
|
1月前
|
移动开发 小程序 前端开发
使用uni-app开发(h5、小程序、app)步骤
使用uni-app开发(h5、小程序、app)步骤
|
2月前
|
移动开发 自然语言处理 小程序
miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目)
miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目)
52 1
|
2月前
|
小程序 安全 JavaScript
【微信小程序】-- uni-app 项目创建 & 目录结构讲解(四十九)
【微信小程序】-- uni-app 项目创建 & 目录结构讲解(四十九)