HBuildX安装和uniapp的示例

2021-06-10 12:01:13 浏览数 (1)

HBuildX安装

HBuilderX是通用的前端开发工具,但为uni-app做了特别强化。

1、下载地址:

https://www.dcloud.io/hbuilderx.html

选择安装正式版,Windows,APP版。

标准版可直接用于web开发、markdown、字处理等,做App仍需要安装插件。App开发版提前打包了App/uni-app开发所需的插件,可以直接使用。

如果使用uni-app cli方式创建项目,你不开发App,只用uni-app做小程序和H5,那使用标准版就可以。

2、解压安装

解压安装包HBuilderX.3.1.13.20210514.full.zip到短路径(如E盘根目录,路径过长会造成解压失败)下,即完成安装。

打开解压目录HBuilderX下,双击HBuilderX.exe即可启动。

第一个uniapp程序

1、打开HBuilderX,选择“新建项目”。

2、进入新建项目页面,

(1)输入工程名称,如helloUniapp,

(2)选择项目类型为“uni-app(U)"

(3)模板使用“Hello uni-app”

3、点击”创建“,下载模板完成创建。

4、编译运行,选择项目,点击菜单”运行“-》运行到浏览器-》选择浏览器,即可体验H5的hello示例。

等待编译完成,在下方控制台中看到编辑成功后,会自动打开浏览器显示结果。控制台输出示例:

16:09:18.390 INFO Starting development server...

16:10:35.869 App running at:

16:10:35.870 - Local: http://localhost:8080/

16:10:35.917 - Network: http://192.168.199.232:8080/

16:10:35.919 项目 'helloUniapp' 编译成功。前端运行日志,请另行在浏览器的控制台查看。

16:10:36.019 H5版常见问题参考: https://ask.dcloud.net.cn/article/35232

0 人点赞