关于学习uniapp心得体会

• 什么是 uni-app

Uni-app是一个基于Vue.js开发的跨平台应用框架，它可以让开发者使用一套代码同时构建多个平台的应用程序，包括微信小程序、H5、App（iOS和Android）、快应用等。

Uni-app采用统一的语法和组件库，在编写代码时不需要考虑平台差异，通过编译器将代码转化为对应平台的应用。这样开发者只需学习一次，就可以在多个平台上开发应用，提高开发效率和代码复用率。

Uni-app提供了丰富的组件和API，支持常见的应用开发需求，如页面路由管理、网络请求、数据绑定、组件化开发等。同时，它也兼容Vue.js生态系统，可以使用Vue.js的语法和特性进行开发。

Uni-app具有较好的性能表现和用户体验，并且得到了广泛的应用和社区支持。对于想要开发跨平台应用的开发者来说，Uni-app是一个方便、高效的选择。

需要注意的是，Uni-app虽然可以实现跨平台开发，但对于某些平台特有的功能或限制可能需要进行额外处理或适配。在开发过程中需要参考平台的开发文档，以确保应用程序能够正常运行和具备平台特色功能。

下面是创建uni-app

创建 uni-app 项目有两种方式：第一种是通过官方的开发者工具 HBuilder 来创建，第二种是通过 vue-cli 命令行创建。

2. 使用 HBuilderX 与使用 cli 创建项目的主要区别

使用 cli 创建项目，编译器是安装在单独的项目下面的，升级时需要手动命令升级，只对这一个项目生效。

使用 HBuilderX 创建项目，编译器是装在 HBuilderX 的插件目录下面了，HBuilderX 版本更新，编译器就会一起更新升级，对所有项目生效。日常开发建议大家直接使用 HBuilder 创建项目就可以了。

3. HBuilder创建项目

HBuilderX 是 uni-app 官方推出的开发者工具，里面内置了开发环境，不需要额外配置 nodejs 环境，可以帮我们省去很多麻烦。

2. uni-ui 项目目录介绍

创建项目时，我们可以选择创建什么类型的模板，如果选择 uni-ui 项目模板，系统就会自动帮我们生成下面的项目目录。

各文件的作用如下：

文件名称	作用
components	是一个用来存放组件的文件夹，从外部引用的组件，或者自己自定义的组件都是放在这个文件夹中
pages	是一个用来存放所有页面的文件夹，也是我们经常操作的一个目录
static	是一个存放静态资源的文件夹，例如图片等
unpackage	是打包目录，存放打包后的文件。有些新建项目目录中没有这个文件夹，在微信开发者工具等编译平台运行后，也会生成这个文件。
App.vue	是页面入口文件，所有页面都是在 App.vue 下进行切换的，可以调用应用的生命周期函数
main.js	是项目入口文件，主要用来初始化 vue 实例并使用需要的插件
manifest.json	是应用配置文件，用于指定应用的名称、图标、权限等
pages.json	是全局配置文件，可以配置页面文件路径、窗口样式、原生的导航栏、底部 tab 栏等
uni.scss	是 uni-app 的样式包。在其他文件中可以快速引用样式包里面的样式

其中 unpackage 打包目录，存放的是打包后的文件，有时候打包后会出现图片或者组件失效的情况，可以检查一下引用路径是否有错误。

3. Hello uni-app 项目目录介绍

创建项目时，选择 Hello uni-app 项目模板，项目创建完成后，会帮我们生成下面的项目目录。其中有几个文件与 uni-ui 项目目录重复了，作用都是一样的。