HBuilderX安装以及运行uniapp项目

这篇具有很好参考价值的文章主要介绍了HBuilderX安装以及运行uniapp项目。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

HBuilderX安装以及运行uniapp项目总结

1.HBuilderX安装官网下载

2.下载完压缩包后,将文件解压,文件名字中不要包含‘( ’

3.创建HBuilderX桌面快捷方式

HBuilderX安装以及运行uniapp项目

4.点击桌面HBuildeX图标运行该程序

5.测试项目

5.1新建项目(以uniapp为例)

HBuilderX安装以及运行uniapp项目
HBuilderX安装以及运行uniapp项目
如果出现如下图所述问题,我采取了用管理员身份运行解决问题,即右键单击程序的图标,点击属性=》高级=》勾选用管理员身份运行。
HBuilderX安装以及运行uniapp项目

5.2运行项目

HBuilderX安装以及运行uniapp项目
因为是第一次使用,所以HBuilderX中的运行依赖都需要下载,只要点击 运行到xxx ,没有的话会自动下载。

5.2.1 下载完成以后,在运行到浏览器那一栏有配置web服务器选项,点击打开.配置好电脑浏览器的地址以及小程序开发工具的地址,node的运行配置(内置终端/外置终端)。

HBuilderX安装以及运行uniapp项目

5.2.2 运行到小程序模拟器采用了微信开发者工具,在web服务器选项配置好微信小程序的地址后运行时报错。

HBuilderX安装以及运行uniapp项目
出现× initialize的错误,这是由于微信开发者工具服务端口未开启。
解决方法:打开微信开发者工具,点击设置=》安全=》打开服务端口
HBuilderX安装以及运行uniapp项目

6.项目测试成功

运行到微信开发者工具
HBuilderX安装以及运行uniapp项目
运行到chrome浏览器
HBuilderX安装以及运行uniapp项目

此文章为本人学习uniapp记录文,会持续更新中,若有错误,欢迎指正。
uniapp官网:https://uniapp.dcloud.net.cn/collocation/pages.html#文章来源地址https://www.toymoban.com/news/detail-494846.html

到了这里,关于HBuilderX安装以及运行uniapp项目的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • HbuilderX运行uniapp项目到微信小程序时,自动打开了微信小程序开发工具但是进不去项目

    这样选择之后,运行时一直停在打开微信开发者工具不能进入项目,如图: 这是因为你当前不是这个微信小程序的开发者,联系管理员添加你为当前小程序的开发者就行了。 或者是更换appid

    2024年02月11日
    浏览(66)
  • HBuilderX运行ios基座调试Uniapp

    uniapp小程序开发需要运行到ios调试基座进行调试,但网上没有mac os和Xcode最新版本的运行流程,所以写下本篇,希望对各位有帮助,适用于有mac电脑或者虚拟机,没有iphone真机的开发环境 第一次运行如果提示下载 mac , ios , watch os , tvos 的SDK,选择mac和ios的下载即可 如果没有

    2024年02月04日
    浏览(45)
  • 通过HBuilderX运行uniapp到微信者开发工具

    目录 一、安装开发工具 二、配置运行微信开发者工具 三、异常处理 1.[微信小程序开发者工具] ? Enable IDE Service (y/N) [27D[27C 2. [error] Error: Fail to open IDE 3.[app.json 文件内容错误] app.json: 在项目根目录未找到 app.json 安装HBuilderX 官方下载地址【官方IDE载地址】 HBuilderX是通用的前端

    2024年02月16日
    浏览(35)
  • 如何使用HbuilderX运行小程序项目

    注意:配置完成之后,在HbuilderX点击运行到小程序模拟器,会自动启动微信开发者工具 1.1 在项目根目录中新建 .gitignore 忽略文件,并配置如下: 注意:忽略 unpackage 目录,默认 unpackage 目录不会被 Git 追踪 此时,为了让 Git 能够正常追踪 unpackage 目录,按照惯例,我们可以在

    2024年02月01日
    浏览(78)
  • 解决前端项目问题,uniapp运行微信开发工具小程序,出现× initialize报错,以及浏览器无法运行

    uniapp进行小程序以及多端web页面都不知道如何配置讲项目运行起来。 就会报出无法运行错误。 [微信小程序开发者工具] - initialize [微信小程序开发者工具] [微信小程序开发者工具] × IDE may already started at port , trying to connect如图 这是因为没有配置好安全设置和运行设置。 一,

    2024年01月20日
    浏览(73)
  • HBuilderX 运行Android App项目至雷电模拟器

    一、下载安装HBuilderX         HBuildeX官网         安装最新的正式版,或者点击历史版本查看更多版本;【ps:Alpha版本为开发版,功能更多,但是也不稳定,属于测试版本】         直接将压缩包解压,运行HBuildeX即可。 二、下载安装雷电模拟器          雷电模拟器

    2024年02月03日
    浏览(55)
  • 第一次使用HbuilderX运行微信小程序项目

     点击设置  再点击运行配置,找到小程序运行配置,设置自己对应的路径 如果没有配置路径,则会报错:  然后粘贴自己的appid就好了

    2024年02月13日
    浏览(56)
  • HBuilderX的uniapp项目APP之Webview调试(像开发网页一样开发APP)

    注意:仅限vue页面 打开HBuilderX - 视图 - 显示Webview调试控制台(勾选) Webview调试 - 真机运行自动打开Webview调试(勾选) 运行 - 运行到手机或模拟器 - 运行到Android APP基座或其他 选择基座(若无自定义则选择标准基座) - 运行 手机APP跳转到测试页面(比如 下图页面为 pages/

    2024年03月14日
    浏览(43)
  • [HBuilderX开发uniapp]自动代码格式化插件安装及配置

    目录 一、前言 二、插件位置 1.在HBuilderX中找到工具------插件安装​ 2.点击“安装新插件”------\\\"前往插件市场安装\\\"  3.插件市场搜索eslint-----点击下载------使用HBuilderX导入插件  三、小结 四、补充 HBuilderX作为H5 web开发的IDE其使用的普及化大幅提高,在应用中为使代码更加优美

    2023年04月08日
    浏览(49)
  • IDEA运行前端vue项目,安装nodejs,以及配置

    我在刚接手到一个项目的时候,不知道前端的代码的情况下,想要写后端代码,遇到问题 所以需要看前台代码,着手IDEA  开始 安装nodejs (为什么要安装nodejs呢,首先就是说需要npm,  而nodejs 内置npm) 1.从官网下载 nodejs 2.然后下一步  下一步  傻瓜式安装 3.选择其他盘符如D盘或

    2024年01月25日
    浏览(58)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包