Hbuilder 与 phpstudy 搭建本地 web 开发环境

安装 phpstudy

首先在 phpstudy 官网下载 phpstudy 安装包,可选择最新 2018 版。

安装时记住安装目录,之后会用到。

安装完成后,无需改动任何设置,保持默认,点击主界面中的启动按钮

若无端口占用等特殊情况,Apache 服务和 MySQL 数据库服务应变为绿色,此时服务器正常运行(如下图)。

图片[1]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网

安装 Hbuilder

在 Hbuilder 官网下载安装,完成后先选择合适的背景颜色及亮度。

首先不要新建项目,找到顶部菜单的:运行 --> 设置 web 服务器。

在设置 web 服务器对话框中,左侧目录树找到外置服务器,点击新建(如下图)。

图片[2]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网

新建的外置 web 服务器配置如下

图片[3]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网

服务器设置完成后,回到设置 web 服务器对话框,点击 Web 服务器,为 HTML、PHP 类型文件指定为外置服务器。

图片[4]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网

Hbuilder 服务器配置完成

导入项目

将项目文件解压,放入 phpstudy 安装目录的 WWW 文件夹下,建议一个项目一个文件夹,如下图

图片[5]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网

如果需要查看运行效果,在浏览器中输入 127.0.0.1 / 项目文件夹名即可查看(要保持 phpstudy 服务开启)

图片[6]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网

如果要在 Hbuilder 中编辑网页文件,在顶部菜单:文件 --> 打开目录

选择 phpstudy 安装目录下 WWW 文件夹内的项目文件夹,即可自动生成项目

图片[7]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网

编辑器工作界面

图片[8]-Hbuilder 与 phpstudy 搭建本地 web 开发环境-小语雀网
© 版权声明
THE END
文章不错?点个赞呗
点赞9赞赏
分享
评论 抢沙发
小语雀的头像-小语雀网

昵称

取消
昵称表情代码图片