hbuilder与微信开发者工具的关系 hbuilderx开发版和标准版

转载

网线小游侠 2023-10-30 14:14:13

uni-app官网

链接: uni-app官网.

hbuilder与微信开发者工具的关系 hbuilderx开发版和标准版_uni-app

使用uni-app需要安装 HBuilder X 开发者工具，可在HBuilder X 中开发与运行项目，也可以使用VScode、WebStorm等软件开发，最后用HBuilder X 运行。

下载地址：https://www.dcloud.io/hbuilderx.html

HBuilder X有标准版和App开发版。

如果只是开发小程序和H5，则安装标准版即可。

打开HBuilder X，选择“文件”→“新建”→“1.项目”命令

hbuilder与微信开发者工具的关系 hbuilderx开发版和标准版_javascript_02

图1.1创建项目

弹出“新建项目”对话框，如图1.2所示：

hbuilder与微信开发者工具的关系 hbuilderx开发版和标准版_hbuilder与微信开发者工具的关系_03

图1.2 “新建项目”对话框

项目创建成功之后的项目目录如下图1.3所示

hbuilder与微信开发者工具的关系 hbuilderx开发版和标准版_javascript_04

1.3项目目录以“浏览器运行模式”为例：选择“运行”→“运行到浏览器”命令，选择浏览器，即可在浏览器中体验uni-app的H5版。

hbuilder与微信开发者工具的关系 hbuilderx开发版和标准版_微信小程序_05

hbuilder与微信开发者工具的关系 hbuilderx开发版和标准版_hbuilder与微信开发者工具的关系_06

uni-app开发小程序非常方便，其开发效率远远高于原生小程序开发。

要开发小程序，必须下载对应小程序的开发者工具。本文章以微信小程序为例

下载微信小程序开发者工具，建议下载稳定版。链接:
下载完成后，进行安装，根据提示操作即可。
安装完成后，打开微信小程序开发者工具的服务端口，进入微信小程序开发者工具，选择“设置”→“安全设置”命令，打开如图2.13所示的窗口，将“服务端口”改为打开状态。
运行项目：打开HBuilder X，进入项目，选择“运行”→“运行到小程序模拟器”→“微信开发者工具”命令，即可在微信小程序开发者工具中体验uni-app注意：第一次使用，需要配置小程序的相关路径才能运行成功。选择“运行”→运行到小程序模拟器→“运行设置”命令，如下图，在对应位置输入微信小程序开发者工具的安装路径。 5.发行小程序：发行微信小程序必须有微信小程序AppID，可在微信公众号平台注册账号（小程序注册页操作步骤），账号注册之后，进入小程序管理后台，选择“开发”→“开发设置”命令，即可在打开的页面中获取微信小程序AppID。稍等片刻，系统会自动启动微信小程序开发者工具。如果没有自动启动，则需要手动打开微信小程序开发者工具。导入项目，项目路径在根目录unpackage/dist/build/mp-weixin 文件中，项目导入后单击“上传”按钮，按照“提交审核”→“发布”小程序标准流程逐步操作即可。