# uniapp-vue3-tailwindcss-uview-plus

**Repository Path**: github-9819409/uniapp-vue3-tailwindcss-uview-plus

## Basic Information

- **Project Name**: uniapp-vue3-tailwindcss-uview-plus
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 1
- **Created**: 2025-04-23
- **Last Updated**: 2025-06-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# uni-app + Vue3 + Tailwind CSS + uview plus项目基础模板

## 项目概述

基于 UniApp，使用 Vue3 作为开发框架，集成了 TailwindCSS 和 uView Plus UI 组件库

## 技术栈
- **前端框架**：Vue3
- **跨平台框架**：UniApp
- **UI 组件库**：uView Plus
- **CSS 框架**：TailwindCSS

## 开发环境搭建

### 安装依赖
```bash
# 使用yarn安装依赖
yarn install
```

### 开发运行

参考 UniApp 官方文档进行开发和运行：
- 使用 HBuilderX 导入项目

## 项目结构
- `pages`：存放页面文件
- `other`：other子包
- `components`：自定义组件
- `static`：静态资源
- `uni_modules`：uView Plus 等模块
- `api`：API接口封装
- `utils`：工具函数
- `config`：项目配置文件

## 样式开发

项目集成了 TailwindCSS，可以使用原子化 CSS 进行快速开发：
```html
<view class="flex justify-center items-center p-4 bg-primary text-white">
  Tailwind 示例
</view>
```

## 温馨提示

* api/login.js提供了接口请求示例,utils/request.js是接口请求封装，里面可以做接口请求拦截和响应拦截
* egg页面是一个彩蛋页，可以切换正式服，测试服，同时能清除本地缓存方便测试
* example_tailwindcss/index是一个tailwindcss的使用示例页面，可以浏览浏览更高效的在uniapp里使用Tailwind css
* 默认引入了 hbxw-utils是我封装的一个工具库，里面提供了很多实用的工具方法，如本地缓存/小程序dom获取等