uniapp什么结构
uniapp 项目结构
uniapp 采用标准化的目录结构，便于开发者快速理解和维护项目。以下是核心目录和文件的说明：
根目录结构
├── pages // 页面目录
├── static // 静态资源目录
├── components // 组件目录
├── uni_modules // 插件模块目录
├── main.js // 入口文件
├── App.vue // 应用配置组件
├── manifest.json // 应用配置（如包名、权限）
├── pages.json // 页面路由与样式配置
└── uni.scss // 全局样式变量核心目录详解
pages 目录
存放所有页面文件，每个页面为一个文件夹，需包含 .vue 文件。例如：
pages/
├── index/
│ └── index.vue // 首页
└── detail/
└── detail.vue // 详情页static 目录
存放静态资源（如图片、字体），编译时直接复制到输出目录。路径引用示例：
<image src="/static/logo.png"></image>components 目录
存放可复用的 Vue 组件，通过 import 引入：
import CustomButton from '@/components/CustomButton.vue'配置文件功能
pages.json
定义页面路由、导航栏样式等。示例配置：
{
"pages": [
{ "path": "pages/index/index", "style": { "navigationBarTitleText": "首页" } }
],
"globalStyle": { "navigationBarTextStyle": "black" }
}manifest.json
配置应用基础信息，如 AppID、启动图。支持多平台差异化配置：
{
"appid": "your_appid",
"h5": { "router": { "mode": "history" } }
}代码组织建议
- 模块化拆分：将业务逻辑拆分为
services或apis目录管理接口请求。 - 状态管理：复杂项目可使用
pinia或vuex，目录通常命名为store。 - 环境变量：在根目录创建
.env文件区分开发/生产环境：VUE_APP_API_BASE=https://dev.example.com
多端适配策略
通过条件编译实现代码差异化：
// #ifdef H5
console.log('仅在H5平台生效');
// #endif静态资源建议使用绝对路径 /static/ 而非相对路径，避免多端路径解析问题。
