admin管理员组文章数量:1606555
一、HBuilder IDE的下载
HBuilder下载官网地址:
在地址栏中直接输入https://www.dcloud.io
或者直接点击下面的链接
DCloud - HBuilder、HBuilderX、uni-app、uniapp、5+、5plus、mui、wap2app、流应用、HTML5、小程序开发、跨平台App、多端框架
进入官网,免费下载最新版的HBuilder。
HBuilder目前有两个版本,一个是windows版,一个是mac版。下载的时候根据自己的电脑选择适合自己的版本。
1. 点击链接进入网站
如下界面:
2. 进入Hbuilder官方网站
如下界面:
3. 下载HBuilder
找到下载按钮【DOWNLOAD】,点击后会出现一个弹窗,根据电脑版本进行选择,点击完成之后便开始进行下载然后进入等待即可。新一代的版本为HBuilder X,上一代的版本为HBuilder。
我这里下载的是上一代HBuilder win(258.6M),点击后跳转至如下界面,点击【普通下载】,即可开始免费下载
4. 解压安装包
下载完成后,可以将压缩包放在合适的位置再进行解压,便于今后查找、管理
5. 找到执行文件
打开解压后的文件夹,找到一个叫做“HBuilder.exe”的可执行文件,这个可执行文件就是HBuilder的启动文件。即下图选中的文件:
HBuilder不用安装解压完成即可使用。
6. 打开HBuilder
双击这个文件就可以打开HBuilder这个开发编辑器了,因为我们是直接解压使用的。所以找起来会很麻烦,你可以将【HBuilder.exe】这个执行文件发送到桌面快捷方式,这样每次使用的时候直接在桌面就可以打开。如下图所示:
不会创建桌面快捷方式的宝宝看过来:
右击【HBuilder.exe】这个执行文件,选择【创建快捷方式】,就会在刚刚的文件下出现一个快捷方式,选中后拖到桌面上就行啦!如下图:
二、HBuilder IDE的使用
1. 打开HBuilder
双击快捷方式或【HBuilder.exe】这个执行文件,会出现如下界面:
2. 登录HBuilder
有账号的直接输入用户名和密码进行登录,没有账号的点击注册用户
输入用户名和密码后登录即可
3. 详细了解HBuilder编辑器
打开之后,你会发现HBuilder的编辑器风格是黄色系,对眼睛比较好,不同于其他编辑器以黑白为主。而且它非常人性化,给你很多的新手入门提示,大家可以详细看看,对这个软件也会有一个全面系统的认识。
· 准备工作
(1)新建项目
新建一个Web项目,依次点击【文件】【新建】选择【Web项目】
或者按下Ctrl+N,选择【Web项目】快速新建
如上图,请在A处填写新建项目的名称,B处填写(或选择)项目保存路径(更改此路径HBuilder会记录,下次默认使用更改后的路径),C处可选择使用的模板(可点击自定义模板,参照打开目录中的readme.txt自定义模板)
(2)新建HTML文件
在项目资源管理器中选择刚才新建的项目,依次点击文件→新建→选择HTML文件(按下Ctrl+N,W可以触发快速新建(MacOS请使用Command+N,然后左键点击HTML文件)),并选择空白文件模板,如下图:
好啦,关于HBuilder IDE的下载与使用就简单的写这么多,想继续了解的可以在底下评论,我再更新博客!如果对你有帮助,可以点赞收藏哦!
版权声明:本文标题:HBuilder的下载与使用(详细步骤) 内容由热心网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:https://www.elefans.com/dianzi/1728496052a1160800.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论