目录
一、认识Uni-app
1、uni-app简介
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。
2、uni-app由来
为解决跨平台开发问题。移动应用开发中，不同平台（如iOS、Android）有不同的开发语言和技术栈，开发者需为不同平台开发多套代码，增加开发维护成本。DCloud公司见此，决心打造终极跨平台解决方案，推出uni-app。使开发者用同一套代码，快速部署到多平台，提高效率、降低成本。
3、为什么选择uni-app
uni-app在开发者数量、案例、跨端抹平度、扩展灵活性、性能体验、周边生态、学习成本、开发成本等8大关键指标上拥有更强的优势。
4、uni-app特点
1、跨更多平台：Uni-app 使用一套代码，即可开发出同时支持多个平台的应用，节省了开发成本和时间。
2、一套代码，多平台运行：Uni-app 的跨平台能力确保了开发者只需编写一套代码，就能够在不同的平台上运行，大大简化了开发流程。
3、运行体验好，性能高：Uni-app 在性能优化方面做了很多工作，确保了应用在各个平台上的流畅性和稳定性，用户体验得到了保障。
4、开发生态、周边生态丰富：Uni-app 提供了丰富的插件和组件，开发者可以借助这些工具和组件，快速实现应用的各种功能需求，极大地提高了开发效率。
5、通用技术栈，学习/开发成本低：Uni-app 使用了基于 Vue.js 的开发模式，可以复用现有的 Vue.js 技能和组件，降低了开发成本。
二、Uni-app环境搭建
1、下载HBuilderX
官网下载地址：HBuilderX-高效极客技巧
选择对应的版本下载即可：
2、下载安装微信开发者工具
下载地址：微信开发者工具下载地址与更新日志 | 微信开放文档
选择合适的版本下载，一步步默认安装即可。安装完成之后，要使用uni-app开发，需要打开微信小程序开发者工具的服务端口，进行微信小程序开发者工具，选择"设置"-->"安全设置"命令，将"服务端口"改完打开状态，如图所示：
3、填入安装路径
打开HBuilderX工具，选择【工具】-->【设置】-->【运行设置】，在微信开发者工具路径输入框中填入微信开发者工具的安装路径。
三、uni-app项目的创建和运行
第一步：新建项目
打开HBuilderX，点击工具栏里的文件 -> 新建 -> 项目
第二步：选择
uni-app
类型，输入工程名，选择模板，点击创建，即可成功创建
第三步：运行
项目创建完成之后即可运行，打开项目的任意文件，如App.vue，选择“运行”
h5端运行："运行到浏览器“命令，选择浏览器，即可在浏览器中体验uni-app的H5版。
微信小程序运行："运行到小程序模拟器“-->"微信开发者工具“命令，即可在微信开发者工具中体验uni-app
四、uni-app项目的打包发布
uni-app项目开发的最后一步就是对项目进行打包发布。打包发布主要分为几种类型：
1、打包为原生App（云端）
2、打包为原生App（离线）
3、发布为h5，操作流程如下：
4、发布为微信小程序
点击【发行】按钮之后，会自动启动微信开发者工具，点击【上传】按钮
出现此截图说明打包上传成功：
此时登录微信公众平台官网。
等待审核通过之后，点击【提交发布】即可发布成功。
扫一扫
3321
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
