uni-app---项目的开发全流程（2、目录结构）

目录结构

        一个uni-app项目，默认是包含如下目录以及文件的

┌─components           # uni-app组件目录
│  └─comp-a.vue        # 可复用的a组件
├─pages                # 业务页面文件存放的目录
│  ├─index
│  │  └─index.vue      # index页面
├─static               # 存放应用引用静态资源（如图片、视频等）的目录，注意：静态资源只能存放于此
├─App.vue              # 应用配置，用来配置App全局样式以及监听 应用生命周期
├─main.js              # Vue初始化入口文件
├─manifest.json        # 配置应用名称、appid、logo、版本等打包信息
└─pages.json           # 配置页面路由、导航条、选项卡等页面类信息

App.vue

它没有template，可以写公共样式，

小程序中最外层的容器不是body，是page

main.js

入口文件，注意条件编译。

pages.json

页面配置

manifest.json

配置文件

uni-app开发规范

uni-app代码编写，基本语言包括js、vue、css。以及ts、scss等css预编译器。

在app端，还支持原生渲染的nvue，以及可以编译为kotlin和swift的uts。

DCloud还提供了使用js编写服务器代码的uniCloud云引擎。所以只需掌握js，你可以开发web、Android、iOS、各家小程序以及服务器等全栈应用。

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

• 页面文件遵循 Vue 单文件组件 (SFC) 规范，即每个页面是一个.vue文件
• 组件标签靠近小程序规范，详见uni-app 组件规范
• 接口能力（JS API）靠近小程序规范，但需将前缀 wx、my 等替换为 uni，详见uni-app接口规范
• 数据绑定及事件处理同 Vue.js 规范，同时补充了应用生命周期及页面的生命周期
• 如需兼容app-nvue平台，建议使用flex布局进行开发

开发方式：vue + 原生小程序部分用法

uni-app生命周期

uni-app框架的生命周期结合了vue和微信小程序的生命周期，具体如下：

应用级别：使用小程序的规范（App.vue）  

onLanch

uni-app官网

页面级别: 使用小程序的规范

onShow, onLoad

页面简介 | uni-app官网

组件级别：与vue的组件相同

页面简介 | uni-app官网

created, destoryed