hello uni app,uniapp启动界面

　　运行uniapp的方法：首先通过HBuilderX工具可视化界面；然后点击工具栏中的“文件-新建-项目”，选择“uni-app”类型创建；最后，进入“hello-uniapp”项目，点击工具栏中的“运行”。

　　UNI-APP开发(仿饿)开发课程：进入学习

　　本教程运行环境：Windows S10系统，Uni-App版本2.5.1，thinkpad t480电脑。

　　推荐(免费):uni-app开发教程

　　Uni-app支持通过可视化界面和vue-cli命令行快速创建项目。

　　1. 通过 HBuilderX 可视化界面

　　可视化方法相对简单。HBuilderX内置相关环境，开箱即用，无需配置nodejs。

　　开始之前，开发人员需要下载并安装以下工具：

　　HBuilderX:https://www.dcloud.io/hbuilderx.html官方IDE下载地址

　　HBuilderX是一个通用的前端开发工具，但是专门针对uni-app进行了增强。

　　下载App开发版，开箱即可使用；如果您下载标准版本，当您运行或发布uni-app时，系统会提示您安装uni-app插件。下载插件后才能使用。

　　如果使用cli创建项目，可以直接下载标准版，因为uni-app编译插件安装在项目下。

　　创建uni-app

　　单击工具栏中的文件-新建-项目：

　　选择uni-app的类型，输入项目名称，选择模板，点击【创建】，创建成功。

　　Uni-app附带了模板Hello uni-app，这是官方的组件和API示例。另一个重要的模板是uni ui项目模板，推荐日常开发使用，内置了大量的常用组件。

　　运行uni-app

　　1.浏览器运行：进入hello-uniapp项目，点击工具栏中的运行-运行至浏览器-选择浏览器，即可在浏览器中体验H5版uni-app。

　　2.真机运行：连接手机，打开USB调试，进入hello-uniapp项目，点击运行-真机运行-在工具栏选择运行设备，就可以在这个设备中体验uni-app了。

　　3.如果无法识别手机，请点击菜单运行-运行到手机或模拟器-故障排除指南进行真机运行。注意，目前开发App还需要安装微信开发者工具。

　　在微信开发者工具中运行：进入hello-uniapp项目，点击工具栏中的运行-运行到小程序模拟器-微信开发者工具，在微信开发者工具中体验uni-app。

　　注意：如果是第一次使用，需要配置小程序ide的相关路径，才能成功运行。如下图，需要在输入框中输入微信开发者工具的安装路径。如果HBuilderX无法正常启动微信开发者工具，需要开发者手动启动，然后将uni-app生成的小程序的路径复制到微信开发者工具中，在HBuilderX中开发，就可以在微信开发者工具中看到实时效果。

　　默认情况下，Uni-app会将项目编译到根目录的解包目录中。

　　4.在支付宝小程序开发者工具中运行：进入hello-uniapp项目，在工具栏点击运行-运行到小程序模拟器-支付宝小程序开发者工具，就可以在支付宝小程序开发者工具中体验uni-app了。

　　5.在百度开发者工具中运行：进入hello-uniapp项目，点击工具栏中的运行-运行到小程序模拟器-百度开发者工具，在百度开发者工具中体验uni-app。

　　6.在字节跳动开发者工具中运行：进入hello-uniapp项目，点击工具栏中的运行-运行到小程序模拟器-字节跳动开发者工具，在字节跳动开发者工具中体验uni-app。

　　7.在360开发工具中导入：进入hello-uniapp项目，在工具栏中点击运行-运行到小程序模拟器-360开发工具，即可在360开发工具中体验uni-app。

　　8.在快应用联盟工具中运行：进入hello-uniapp项目，在工具栏中点击运行-运行到小程序模拟器-快应用联盟工具，就可以在快应用联盟工具中体验uni-app。

　　9.在华为开发者工具中运行：进入hello-uniapp项目，点击工具栏中的运行-运行至小程序模拟器-华为开发者工具，在华为开发者工具中体验uni-app。

　　10.在QQ小程序开发工具中运行：内容同上，不再赘述。以上是hello uniapp如何运行的细节。更多请关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。