cc18a19e7ecff9d1dde30c293eb44f11acaf4b38
uni-app
## 特性-
🔧 ESM 优先
-
🗂 基于文件的路由
-
📦 组件自动化加载
-
📑 布局系统
-
🎨 UnoCSS - 高性能且极具灵活性的即时原子化 CSS 引擎
-
🔥 使用 新的
<script setup>语法 -
📥 API 自动加载 - 直接使用 Composition API 无需引入
-
🦾 TypeScript & ESLint - 保证代码质量
项目结构
Road_roller/
├── .github/ # GitHub Actions CI/CD 配置
├── .hbuilderx/ # HBuilderX 编辑器配置
├── .opencode/ # OpenCode AI 工具配置(skills、插件等)
├── .vscode/ # VS Code 编辑器配置
├── dist/ # 构建输出目录
├── node_modules/ # 依赖包
├── src/ # 源代码目录
│ ├── api/ # 接口请求
│ │ ├── request.ts # Axios 请求封装(拦截器、基础配置)
│ │ └── home/ # 首页相关接口
│ ├── components/ # 公共组件(自动加载)
│ │ ├── AppFooter.vue
│ │ ├── AppLogos.vue
│ │ ├── HiCounter.vue
│ │ └── InputEntry.vue
│ ├── composables/ # 组合式函数(自动加载)
│ │ ├── useCount.ts # 计数器逻辑
│ │ └── useQuery.ts # 查询参数解析
│ ├── layouts/ # 页面布局组件
│ │ ├── default.vue # 默认布局
│ │ └── home.vue # 首页布局
│ ├── mock/ # 模拟数据
│ │ ├── index.ts # Mock 数据入口
│ │ └── time.ts # 时间相关 Mock
│ ├── pages/ # 页面文件(文件路由)
│ │ ├── home/ # 首页
│ │ ├── work/ # 工作页
│ │ └── report/ # 报告页
│ ├── static/ # 静态资源(图标、图片)
│ ├── store/ # Pinia 状态管理
│ │ └── index.js
│ ├── utils/ # 工具函数
│ ├── App.vue # 根组件
│ ├── main.ts # 应用入口
│ ├── manifest.json # uni-app 应用配置
│ ├── pages.json # 页面路由配置(自动生成)
│ ├── theme.json # 主题变量(亮色/暗色)
│ └── uni.scss # uni-app 全局样式变量
├── eslint.config.js # ESLint 配置
├── manifest.config.ts # uni-app manifest 配置(源文件)
├── pages.config.ts # 页面路由配置(源文件)
├── unh.config.ts # uni-helper CLI 配置
├── uno.config.ts # UnoCSS 原子化 CSS 配置
├── vite.config.ts # Vite 构建配置
└── vitest.config.ts # Vitest 测试配置
目录说明
| 目录 | 作用 |
|---|---|
src/api |
接口请求封装,基于 Axios + uni-app 适配器 |
src/components |
公共 Vue 组件,通过 vite-plugin-uni-components 自动加载 |
src/composables |
Vue 3 组合式函数,通过 unplugin-auto-import 自动导入 |
src/layouts |
页面布局模板,通过 vite-plugin-uni-layouts 管理 |
src/mock |
开发环境模拟数据 |
src/pages |
页面组件,文件即路由(vite-plugin-uni-pages) |
src/static |
静态资源,打包时原样复制到输出目录 |
src/store |
Pinia 状态管理,自动导入 |
src/utils |
工具函数,自动导入 |
功能模块
Languages
Vue
54.2%
TypeScript
44.8%
SCSS
0.7%
HTML
0.2%
