uniapp 目录结构及开发规范

2023-01-05 08:20:30 浏览数 (1)

1. 目录结构

代码语言:javascript复制
│─pages           页面文件存放目录
├─static          静态资源存放目录
├─unpackage       编译文件存放目录,做版本管理时将此目录忽略
├─main.js         Vue初始化入口文件
├─App.vue         应用配置,用来配置App全局样式以及监听应用生命周期
├─manifest.json   配置应用名称,appid、logo、版本等打包信息
├─pages.json      配置页面路由、导航条、选项卡等页面类信息

manifest.json 文件是应用的配置文件, 用于指定应用的名称、图标、权限等。

main.js 是uni-app的入口文件,主要作用是初始化vue示例、定义全局组件、使用需要的插件(如:vuex)

pages.json 文件用来对 uni-app 进行全局配置, 决定页面文件的路径、窗口样式、原生的导航栏、底部的远程 tabbar 等。它类似于微信小程序中的app.json的页面管理部分。特别注意:定位权限申请等原属于app.json的内容,在uni-app中是在 manifest 中配置

2. 开发规范

为了实现多端兼容, 综合考虑编译速度、运行性能等因素,uni-app 约定了如下开发规范

1. 页面文件遵循 vue 单文件组件 (SFC)规范

2. 组件标签靠近小程序规范, 详情见 uni-app 组件规范

3. 接口能力(JS API)靠近微信小程序规范, 但需将前缀 wx 替换为 uni, 详情见 uni-app 接口规范

4. 数据绑定及事件处理同 Vue.js 规范, 同时补充了App及页面的生命周期

5. 为兼容多端运行, 建议使用 flex 布局进行开发

0 人点赞