首先,这个我是在B站上学习到的教程;下面是教程的一些资料.如有侵权,请联系我删除,谢谢

1. 教程链接分享

B站教程链接:  https://www.bilibili.com/video/BV1Yg4y127Fp/

作者Gitee仓库:  https://gitee.com/qingnian8/univue3

2. 编译器选择

   我们优先推荐HBuilderX, 安装方式,直接百度搜索uni-app官方,在官方上就可以找到HBbuilderX的介绍及下载地址: https://hx.dcloud.net.cn/

   官方深度适配，开箱即用

• 无缝集成：HBuilderX 由 uni-app 的官方团队 DCloud 开发，天然支持 uni-app 的核心功能，无需额外配置环境或插件，安装即可直接开发。
• 模板丰富：内置多种项目模板（如电商、新闻应用），一键生成标准项目结构，省去搭建框架的时间

   高效开发工具链

• 智能代码辅助：针对 Vue 语法和 uni-app API 提供精准的代码提示、自动补全，甚至独有的“代码块”功能（输入 uButton 可快速生成按钮组件）。
• 实时预览与调试：
• 边改边看：修改代码后，内置模拟器或真机实时刷新，无需手动编译。
• 多端同步调试：同时连接多个设备，一键同步调试不同平台（如同时查看 iOS 和 Android 效果）

   跨平台发布极度简化

• 一键多端编译：同一套代码，通过图形化界面勾选目标平台（微信小程序、H5、App 等），直接生成对应代码包，避免重复劳动。
• 云打包服务（特别亮点）：
• 免环境配置：无需在本地安装 Xcode 或 Android SDK，上传代码到云端即可生成安装包，尤其适合 iOS 证书复杂的场景。
• 节省时间：本地打包可能需要数小时的环境配置，云打包几分钟即可完成

   贴近原生开发的体验

• 真机运行流畅：通过数据线连接手机，直接调试 App 效果，支持日志输出、性能分析等，媲美原生开发工具。
• 原生插件支持：方便集成第三方原生模块（如地图、支付），HBuilderX 提供插件市场，简化扩展流程。

使用HBuilderX创建uni-app项目

   在此页面中,我们可以看到,创建的时候要输入名称、可以选择路径、可以选择官方推荐的一些模板、然后要注意的是博主说的是,如果要开发app,要勾选umi-app x这个选项; 最后我们这个教程选用的都是Vue3来开发的

3.项目工程结构

   官方链接:  https://uniapp.dcloud.net.cn/tutorial/project.html

┌─uniCloud              云空间目录，支付宝小程序云为uniCloud-alipay，阿里云为uniCloud-aliyun，腾讯云为uniCloud-tcb（详见uniCloud）
│─components            符合vue组件规范的uni-app组件目录
│  └─comp-a.vue         可复用的a组件
├─utssdk                存放uts文件（已废弃）
├─pages                 业务页面文件存放的目录
│  ├─index
│  │  └─index.vue       index页面
│  └─list
│     └─list.vue        list页面
├─static                存放应用引用的本地静态资源（如图片、视频等）的目录，注意：静态资源都应存放于此目录
├─uni_modules           存放uni_module 详见
├─platforms             存放各平台专用页面的目录，详见
├─nativeplugins         App原生语言插件 详见
├─nativeResources       App端原生资源目录
│  ├─android            Android原生资源目录 详见
|  └─ios                iOS原生资源目录 详见
├─hybrid                App端存放本地html文件的目录，详见
├─wxcomponents          存放微信小程序、QQ小程序组件的目录，详见
├─mycomponents          存放支付宝小程序组件的目录，详见
├─swancomponents        存放百度小程序组件的目录，详见
├─ttcomponents          存放抖音小程序、飞书小程序组件的目录，详见
├─kscomponents          存放快手小程序组件的目录，详见
├─jdcomponents          存放京东小程序组件的目录，详见
├─unpackage             非工程代码，一般存放运行或发行的编译结果
├─main.js               Vue初始化入口文件
├─App.vue               应用配置，用来配置App全局样式以及监听 应用生命周期
├─pages.json            配置页面路由、导航条、选项卡等页面类信息，详见
├─manifest.json         配置应用名称、appid、logo、版本等打包信息，详见
├─AndroidManifest.xml   Android原生应用清单文件 详见
├─Info.plist            iOS原生应用配置文件 详见
└─uni.scss              内置的常用样式变量

4. 运行项目

   在HBuilderX菜单栏中找到运行,就可以运行到真机、小程序、浏览器等运行中