更新记录

1.0.0（2025-03-07） 下载此版本

初始化模版

平台兼容性

uni-app Vue3 Vite pinia TypeScript Tailwind CSS v4 基础框架

简介

• uni-app Vue3 Vite pinia TypeScript Tailwind CSS v4 基础框架
• cli 创建的 Vue3/Vite 项目 与 使用 HBuilderX 导入插件 的包有差异,最好使用vscode开发,请直接访问 开源地址

说明

• 框架完全基于 Vue3 <script setup> 写法,不支持 Vue2;
• 可用于学习与交流;
• 目前测试 H5、微信小程序,APP(Android)通过;
• 其他平台暂未测试,后续会增加;
• 如发现问题或建议可在评论区留言, 看到会及时处理;
• 如有需求亦可在评论区留言,或在此项目基础上增加;
• 代码规范 husky、prettier、eslint、lint-staged、stylelint 的作用和使用

特性

• 最新技术栈：使用 Vue3/Vite/pinia,TypeScript,Tailwind CSS v4, 等前端前沿技术开发;
• vue3组件库: wot-design-uni 组件库，wot-design-uni组件库基于vue3+Typescript构建，参照wot desing的设计规范进行开发，旨在给开发者提供统一的UI交互，同时提高研发的开发效率。
• Tailwind CSS 4.0: Tailwind CSS 4.0 ailwind CSS v4.0 是对该框架的彻底重写，它吸收了我们多年来对架构的所有了解，并对其进行了优化，使其尽可能快。当我们对自己的项目进行基准测试时，我们发现完全重建速度提高了 3.5 倍以上，增量构建速度提高了 8 倍以上。
• Eslint/Prettier: 规范代码样式格式,统一编码;
• husky: 提交代码钩子
• 请求拦截: luch-request 是一个基于Promise 开发的uni-app跨平台、项目级别的请求库，它有更小的体积，易用的api，方便简单的自定义能力。

目录结构

├─ src
│ ├─api # 接口文件目录
│ ├─static # 静态公共文件
│ │ ├─ images # 图片
│ │ │ ├─.png
│ │ │ └─...
│ │ │
│ │ └─ ...
│ │
│ ├─components # 组件目录
│ ├─pages # 页面
│ │ ├─ index
│ │ │ └─index.vue
│ │ └─...
│ │
│ ├─style # 样式
│ │
│ ├─stores # 状态管理模式(pinia)
│ │ ├─ modules # 数据模块
│ │ │ ├─app.ts
│ │ │ └─...
│ │ │
│ │ └─ index.ts
│ │
│ └─utils # 工具类
│ └─ request.ts #api请求拦截
├─ .env
├─ .env.development
├─ .env.production
├─ .eslintignore
├─ .eslintrc.js
├─ .gitignore
├─ .prettierignore
├─ .prettierrc.js
├─ .commitlint.config.js
├─ .stylelint.config
├─ index.html
├─ package.json
├─ README.md
├─ tailwind.config.js
├─ tsconfig.json
└─ vite.config.ts

安装使用

• 安装依赖

npm install

• 运行

# 其他端请查看 package.json script
npm dev:h5

• 打包

# 其他端请查看 package.json script
npm build:h5

• npm run cz提交命令 先git add. 后在使用这个命令

npm run cz

提交类型