当前位置: 首页 > news >正文

HBuilder X 4.76 开发微信小程序集成 uview-plus

简介

本文记录了在HBuilder中创建并配置uni-app项目的完整流程。

首先创建项目并测试运行,确认无报错后添加uView-Plus组件库。

随后修改了main.js、uni.scss、App.vue等核心文件,配置manifest.json并安装dayjs、clipboard等依赖库。

通过调整vite.config.js和添加rollup-plugin-visualizer插件优化构建配置,同时启用easycom组件模式。

最后完成了TypeScript支持配置,并通过多张截图展示了各组件在不同主题色下的测试效果,验证了整个项目的正常运行。

整个过程涵盖了从初始化到UI组件集成的完整开发环节。

创建项目

在这里插入图片描述

测试运行

在这里插入图片描述
在这里插入图片描述
需要在HBuilder 中补上AppId
在这里插入图片描述
在这里插入图片描述
运行正常,没有报错。

添加 uview-plus

打开地址 https://ext.dcloud.net.cn/plugin?name=uview-plus
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

修改 main.js

在这里插入图片描述

修改 uni.scss

在这里插入图片描述

修改App.vue

在这里插入图片描述

配置manifest

在这里插入图片描述

安装依赖库

在这里插入图片描述

npm init -y
npm i dayjs
npm i clipboard

在这里插入图片描述
在这里插入图片描述

修改 vite.config.js

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

安装 :rollup-plugin-visualizer

npm i rollup-plugin-visualizer -D 

配置easycom组件模式

在这里插入图片描述

typescript支持

在这里插入图片描述
在这里插入图片描述

测试

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

补充:清理日志

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
好了,这样日志旧干净了。

http://www.dtcms.com/a/364093.html

相关文章:

  • 关于IDE的相关知识之一【使用技巧】
  • GFSK信号生成算法原理详解
  • 避免侵权!这6个可免费下载字体网站能放心商用
  • 「数据获取」《安徽建设统计年鉴》(2002-2007)(2004、2006缺失)(获取方式看绑定的资源)
  • 【世纪龙科技】汽车专业数字化课程资源包-虚拟仿真实训资源建设
  • MYSQL配置复制拓扑知识点
  • 告别集成烦恼!H-ZERO iframe 支持第三方系统 / AI 助手轻松接入
  • 【机器学习入门】5.3 线性回归原理——从模型定义到参数求解,手把手带练
  • 模型常见训练超参数介绍(1)
  • Vue.js 中深度选择器的区别与应用指南
  • Corrosion: 1靶场渗透
  • 新手也能轻松选!秒出PPT和豆包AI PPT优缺点解析
  • 自学嵌入式第三十三天:网络编程-UDP
  • SpringMVC的RequestMapping注解与请求参数绑定
  • 六、结构化开发方法
  • 《2025年AI产业发展十大趋势报告》三十五
  • MySQL数据库——概述及最基本的使用
  • Netty从0到1系列之NIO
  • 命令小工具
  • 文华财经wh6波段多空指标-变色K做多做空信号,抄底逃顶主图幅图
  • 从入门到实战:Linux sed命令全攻略,文本处理效率翻倍
  • IsaacLab训练机器人
  • 保障系统稳定运行!瑞芯微RK3506Watchdog看门狗配置与使用攻略
  • 【系统架构师设计(9)】需求工程全生命周期管理:从定义到变更的完整体系
  • 第2.7节:多模态大模型之Midjourney
  • 《面试必备:JVM垃圾回收机制深度解析(附高频问题应对)》
  • 【线段树】3525. 求出数组的 X 值 II|2645
  • solidity从入门到精通 第七章:高级特性与实战项目
  • 机器视觉的平板电脑OCA全贴合应用
  • 修改⽂件之git