Uniapp开发模板unibest

🏠简介

unibest 是一个集成了多种工具和技术的 uniapp 开发模板,由 uniapp + Vue3 + Ts + Vite4 + UnoCss + uv-ui + VSCode 构建,模板具有代码提示、自动格式化、统一配置、代码片段等功能,并内置了许多常用的基本组件和基本功能,让你编写 uniapp 拥有 best 体验。

 

✨ 特性 ​

  • ⚡️ Vue 3, Vite, pnpm, esbuild - 就是快!

  • 🔥 最新语法 - <script lang="ts" setup> 语法

  • 🎨 UnoCSS - 高性能且极具灵活性的即时原子化 CSS 引擎

  • 😃 UnoCSS Icons & icones - 海量图标供你选择

  • 🍍 pinia & pinia-plugin-persistedstate - 全端适配的全局数据管理

  • 🗂 uni.request 请求封装 - 一键引入,快捷使用

  • 📦 组件自动化加载 - 可配置化的组件加载方式,轻松加载组件

  • 📥 API 自动加载 - 直接使用 Composition API 无需引入

  • 🎉 v3 Code Snippets 加快你的页面生成

  • 🦾 TypeScript & ESLint & stylelint - 保证代码质量

  • 🌈 husky & lint-staged + commitlint - 保证代码提交质量

  • 💡 ES6 import 自动排序,css 属性 自动排序,增强编码一致性

  • 🖥 多环境 配置分开,想则怎么配置就怎么配置

 👍 实用功能

  • [x] 页面下拉刷新(全局+局部)
  • [x] 页面上拉加载
  • [x] 导航栏返回 or 去首页
  • [x] 导航栏渐变(微信+h5+App)
  • [x] 自定义导航栏顶部机型适配
  • [x] 微信小程序分享(好友+朋友圈)
  • [x] 微信登录
  • [ ] 非微信登录(h5 和 App)
  • [ ] 微信一键登录(基于手机号)- 需要非个人认证用户
  • [x] 微信小程序获取头像昵称+隐私协议
  • [x] 微信小程序 vconsole 调试
  • [x] 路由拦截
  • [x] 多语言模板
  • [x] 页面悬浮球(floating bubble)
  • [x] 多 tab 列表功能
  • [x] 瀑布流
  • [x] 大转盘抽奖
  • [x] 九宫格抽奖
  • [ ] 登陆模板(APP)
  • [ ] 登陆模板(H5)

 ⌛️实践

    前置依赖

  • Node.js - >=v18
  • pnpm - >=7.30(推荐使用 8.15
  • 文本编辑器 - 推荐使用 VS Code
  • 终端 - 为了运行 uni 命令,Windows 推荐 Git Bash,Linux 和 macOS 推荐 zsh

 下载项目​

通过 pnpm create unibest <项目名> 命令生成项目模版:

pnpm create unibest <项目名称> # 默认用 base 模板
pnpm create unibest <项目名称> -t <模板名> # 支持自定义模板

支持 -t 参数选择模板,目前已有 3 个模板,分别是 basei18ndemo。 

pnpm create unibest my-unibest -t base # 基础模板
pnpm create unibest my-unibest -t i18n # 多语言模板
pnpm create unibest my-unibest -t demo # 所有demo的模板,包含了i18n

 

安装依赖 

pnpm i

运行 

 

📱 在线预览

 

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

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

相关文章

软件安全——堆栈基础知识点总结

一、堆栈基础——内存区域 1、内存区域相关概念 内存区域&#xff1a;一个进程可能被分配到不同的内存区域去执行&#xff1a; 代码区&#xff1a;这个区域存储着被装入执行的二进制机器代码&#xff0c;处理器会到这个区域取指并执行。 数据区&#xff1a;用于存储全局变量…

重拾C++之菜鸟刷算法第10篇---二叉树(下)

十五、合并二叉树 题目 给你两棵二叉树&#xff1a; root1 和 root2 。 想象一下&#xff0c;当你将其中一棵覆盖到另一棵之上时&#xff0c;两棵树上的一些节点将会重叠&#xff08;而另一些不会&#xff09;。你需要将这两棵树合并成一棵新二叉树。合并的规则是&#xff1…

【NR 定位】3GPP NR Positioning 5G定位标准解读(八)- OTDOA定位

前言 3GPP NR Positioning 5G定位标准&#xff1a;3GPP TS 38.305 V18 3GPP 标准网址&#xff1a;Directory Listing /ftp/ 【NR 定位】3GPP NR Positioning 5G定位标准解读&#xff08;一&#xff09;-CSDN博客 【NR 定位】3GPP NR Positioning 5G定位标准解读&#xff08;…

车规芯片为什么需要信息安全(1)

目录 1.汽车出现过被黑客攻击事件吗&#xff1f; 2.汽车信息安全标准汇总 2.1 国际标准 2.2 国内标准 3.车规芯片的信息安全应该从什么地方考虑 3.1 芯片硬件安全防护能力 3.2 车规芯片的信息安全服务 3.3 芯片厂如何证明芯片的信息安全能力 4.小结 这个来自家里人的灵…

WebGL之创建 3D 对象

现在让我们给之前的正方形添加五个面从而可以创建一个三维的立方体。最简单的方式就是通过调用方法 gl.drawElements() 使用顶点数组列表来替换之前的通过方法gl.drawArrays() 直接使用顶点数组。而顶点数组列表里保存着将会被引用到一个个独立的顶点。 其实现在会存在这样一个…

设计模式学习系列 -- 随记

文章目录 前言 一、设计模式是什么&#xff1f; 二、设计模式的历史 三、为什么以及如何学习设计模式&#xff1f; 四、关于模式的争议 一种针对不完善编程语言的蹩脚解决方案 低效的解决方案 不当使用 五、设计模式分类 总结 前言 最近可能工作生活上的稳定慢慢感觉自己丢失…

【轮式平衡机器人】——TMS320F28069片内外设之ePWM

声明&#xff1a;本系列博客参考有关专业书籍&#xff0c;截图均为自己实操&#xff0c;仅供交流学习&#xff01; 引入 脉冲宽度调制&#xff08;PWM&#xff09;是一种对模拟信号进行数字编码的方法&#xff0c;硬件原理是根据相应载荷的变化来调制晶体管栅极或基极的偏置&…

【c++】string模拟实现

string类的接口 namespace zjw {class string{public:typedef char* iterator;typedef const char* const_iterator;private:char* _str;int _size;int _capacity;};这里的迭代器直接使用原生指针来封装。 _str为指向string数组的首地址的指针。 _size为string数组的大小。 …

测试工具使用技巧01-->jmeter链接mysql

前言 在做接口或者性能测试的时候&#xff0c;有时需要jmeter连接数据库做操作&#xff0c;可以看看如下实例。操作实例 在mysql数据库中有如下数据表 在jmeter导入jdbc驱动插件&#xff08;需要的留言找我拿&#xff09; 在jmeter测试计划元件最下面&#xff0c;导入jdbc.…

Android平台实现无纸化同屏并推送RTMP或轻量级RTSP服务(毫秒级延迟)

技术背景 在写这篇文章之前&#xff0c;实际上几年之前&#xff0c;我们就有非常稳定的无纸化同屏的模块&#xff0c;本文借demo更新&#xff0c;算是做个新的总结&#xff0c;废话不多说&#xff0c;先看图&#xff0c;本文以Android平台屏幕实时采集推送&#xff0c;Windows…

ActiveRAG—主动学习

原文地址&#xff1a;ActiveRAG — Active Learning 2024 年 2 月 26 日 大型语言模型&#xff08;LLM&#xff09;的出现开创了对话式人工智能的新时代。这些模型可以生成非常类似人类的文本&#xff0c;并且比以往更好地进行对话。然而&#xff0c;他们仍然面临着仅仅依靠预先…

面试宝典-【redis】

目录 1.什么是缓存穿透 ? 怎么解决 ? 2.什么是布隆过滤器 3.什么是缓存击穿 ? 怎么解决 ? 4.什么是缓存雪崩 ? 怎么解决 ? 5.redis做为缓存&#xff0c;mysql数据如何与redis进行同步?(双写) 6.排他锁是如何保证读写、读读互斥的呢&#xff1f; 7.你听说过延…

【万题详解】洛谷P1616 疯狂的采药

题目背景 此题为纪念 LiYuxiang 而生。 题目描述 LiYuxiang 是个天资聪颖的孩子&#xff0c;他的梦想是成为世界上最伟大的医师。为此&#xff0c;他想拜附近最有威望的医师为师。医师为了判断他的资质&#xff0c;给他出了一个难题。医师把他带到一个到处都是草药的山洞里对…

什么是yocto基本组件(bitbake,recipes,classes,configuration,layer)

文章目录 1基本组件1.1 bitbake1.2 Recipes1.3 Classes1.4 Configurations2 层的理解2.1 层结构2.2 nxp yocto示例2.3 ti yocto示例1基本组件 1.1 bitbake bitbake,是OpenEmbedded构建系统的核心工具,负责解析元数据,从中生成任务列表,然后执行这些任务。bitbake是一个通…

C# LINQ运算符

LINQ运算符 1. 概述1.1 集合->集合1.1.1 筛选运算符1.1.2 映射运算符1.1.3 连接运算符1.1.4 排序运算符1.1.5 分组运算符1.1.6 集合运算符1.1.7 转换方法:Import1.1.8 转换方法:Export 1.2 集合->单个元素或标量值1.2.1 元素运算符1.2.2 聚合方法1.2.3 数量词 1.3 空->…

【MySQL 系列】MySQL 语句篇_DQL 语句

DQL&#xff08;Data Query Language&#xff09;&#xff0c;即数据查询语言&#xff0c;用来查询数据记录。DQL 基本结构由 SELECT FROM、WHERE、JOIN 等子句构成。 DQL 语句并不会改变数据库&#xff0c;而是让数据库将查询结果发送结果集给客户端&#xff0c;返回的结果是一…

软考72-上午题-【面向对象技术2-UML】-UML中的图3

一、状态图 1-1、状态图的定义 状态图&#xff0c;展现了一个状态机&#xff0c;由&#xff1a;状态、转换、事件和活动组成&#xff0c;是系统的动态视图。 活动(动作) 可以在状态内执行也可以在状态转换(迁移) 时执行。 状态图强调&#xff1a;行为的事件顺序。 1-2、状态图…

SpringBoot项目如何部署到服务器

文章目录 准备&#xff1a;方式一&#xff1a;Jar包方式&#xff08;推荐&#xff09;部署步骤&#xff1a; 方式二&#xff1a;War包方式部署步骤&#xff1a; 总结 准备&#xff1a; 云服务器&#xff08;阿里云、腾讯云等&#xff09;Linux系统以及运行所需的环境 方式一&a…

力扣--深度优先算法/回溯算法216.组合总和 Ⅲ

思路分析&#xff1a; 深度优先搜索 (DFS)&#xff1a; 通过递归实现&#xff0c;尝试从数字 1 到 9 中选择可能的数字&#xff0c;构建和为 n&#xff0c;长度为 k 的组合。递归函数 dfs&#xff1a; 接收参数&#xff1a;result 为最终结果集&#xff0c;path 为当前正在生成…

AWS认证:云计算领域的卓越里程碑

本文由云计算狂魔公众号提供 随着科技的飞速发展&#xff0c;云计算已成为企业与个人必备的技能之一。亚马逊网络服务&#xff08;Amazon Web Services&#xff0c;简称AWS&#xff09;作为全球领先的云计算服务提供商&#xff0c;其认证体系无疑是云计算领域的卓越里程碑。本…