Skip to content

Visual Studio Code#

Visual Studio Code 是微软推出的一款优秀的代码编辑器。

开箱即用，它提供了语法高亮和一定程度的代码智能提示，但通过轻松安装的扩展，可以将其转变为一个非常强大的开发环境。

首先下载并安装 VS Code。

工作区文件夹#

作为起点，您可以将 VS Code 指向您的 www 文件夹。

从 文件 菜单中选择 打开文件夹...，然后指向您的 www 文件夹。

现在，您放入该文件夹的任何文件都会立即显示在 VS Code 的资源管理器面板中。

扩展#

前往界面左侧面板中的 扩展 视图——它看起来像三个方块，旁边还有一个浮动的方块。

禁用内置的 PHP 功能#

您必须禁用内置的 PHP 语言功能，因为它们将被我们下一步安装的扩展 PHP Intelephense 所取代。

为此，在扩展列表顶部的搜索框中输入 @builtin php。这将显示两个组件：PHP 语言基础和 PHP 语言功能。使用齿轮图标 禁用 PHP 语言功能，但保留 PHP 语言基础，因为我们仍将使用该组件的语法高亮功能。

安装扩展#

您需要安装一些扩展，以启用使 VS Code 成为强大开发环境的高级功能。

使用搜索框查找并安装以下扩展：

  • PHP Intelephense
  • PHP Debug
  • Visual Studio Intellicode
  • SQLTools MySQL/MariaDB

安装完上述扩展后，确保它们完全激活，方法是退出 VS Code 并重新启动它。这有助于清除任何缓存的设置并重新初始化引擎。

调试#

调试 是一种强大的编程工具，允许您在程序运行的任何点暂停并检查其环境、状态和上下文，然后逐步执行后续代码。

添加 Xdebug 助手#

大多数调试操作将从浏览器触发，因此您需要安装一个扩展来指示调试器启动。

为了简单起见，我们将详细介绍 Google Chrome 的 Xdebug 助手，但 Xdebug 文档 列出了适用于其他浏览器的扩展。

下载并安装该扩展，然后按照扩展网页上的说明将其切换到 调试 模式。

调试配置#

在我们可以在 VS Code 中使用 Xdebug 之前，我们需要添加一个调试配置。

从 运行 菜单中选择 添加配置...，然后在弹出的对话框中选择 PHP。这将创建一个包含两个配置的 launch.json 文件——'Listen for XDebug' 和 'Launch currently open script'。

切换到左侧面板中的 运行 视图——它看起来像一个带有虫子图标的三角形。

在面板顶部，您会找到一个带有“播放”（三角形）图标和文本“Listen for XDebug”的小工具。点击三角形，您会注意到 VS Code 窗口底部的状态栏颜色发生变化，表示它正在监听。

您可以随时切换监听模式。

要开始调试脚本，请在代码中添加断点，方法是在脚本行号左侧的边栏中添加一个点。

当脚本运行时，执行将在到达断点时暂停，允许您检查应用程序在该点的状态和上下文。

调试示例#

打开 Laragon 放置在 www 文件夹中的 index.php 脚本。

在第 2 行放置一个断点——if (!empty($_GET['q'])) {，并确保 VS Code 处于“Listen for XDebug”模式。

打开一个新的浏览器标签页，将 Xdebug 助手设置为 调试 模式，然后在地址栏中输入 URL http://localhost/?q=info。

Xdebug 应触发 VS Code 进入调试模式，并在执行第 2 行的语句之前暂停执行。

在 变量 面板中，展开 超全局变量 组，您会看到 $_GET 被标记为 array(1)，表示它有一个成员。展开折叠的 $_GET 部分，您会看到其成员是 q，值为 info，正如我们所期望的那样，因为我们刚刚通过 GET 向脚本传递了 ?q=info。

您现在可以使用调试工具栏上的 Step Over 按钮（或按键盘上的 F10）让执行逐行继续，直到所有 PHP 代码执行完毕，页面将在浏览器中完全加载。

高级调试#

本教程不详细介绍如何使用步进调试器，但网上有很多资源可以帮助您掌握要点。

资源链接#