配置 JavaScript 调试器
PyCharm 为您的 客户端 JavaScript 代码提供内置调试器。 当您 启动调试会话 时，内置调试器会自动启动。
为确保调试成功，只需指定内置 Web 服务器端口，并接受 PyCharm 为其他调试器选项建议的默认设置。
开始之前
请确保在设置中启用了捆绑插件 JavaScript and TypeScript。 按 Ctrl+Alt+S 打开设置，然后选择 。 点击 已安装 选项卡。 在搜索字段中，键入 JavaScript and TypeScript。 有关插件的更多信息，请参阅 管理插件。
请确保在设置中启用了捆绑插件 JavaScript Debugger。 按 Ctrl+Alt+S 打开设置，然后选择 。 点击 已安装 选项卡。 在搜索字段中，键入 JavaScript Debugger。 有关插件的更多信息，请参阅 管理插件。
设置内置 Web 服务器端口
PyCharm 具有一个内置 Web 服务器，可用于在 Web 浏览器中调试您的应用程序，或在 PyCharm 的内置浏览器中预览您的代码。 该服务器始终运行，无需任何手动配置。 了解详情，请参阅 调试在内置服务器上运行的应用程序。
按 Ctrl+Alt+S 打开设置，然后选择 。
在 内置服务器 区域，指定内置 Web 服务器运行的端口。 默认情况下，此端口设置为默认的 PyCharm 端口 63342 ，PyCharm 通过该端口接受来自服务的连接。 您可以将端口号设置为从 1024 开始的任意其他值。
自定义默认调试器配置
抑制调用
按 Ctrl+Alt+S 打开设置，并导航到 。
分别清除 可接受外部连接(E) 或 允许未签名的请求(A) 复选框，以抑制来自其他计算机或 PyCharm 外部对内置服务器上文件的调用。
选择移除断点的方式
默认情况下，您可以通过点击鼠标左键切换断点。 要更改此行为：
按 Ctrl+Alt+S 打开设置，并导航到 。
在 移除断点 区域，选择相应的选项。
高级选项
按 Ctrl+Alt+S 打开设置，并导航到 。
启用或禁用 内联调试 ，指定何时显示包含对象值和 表达式计算结果 的工具提示等。
按 Ctrl+Alt+S 打开设置，并导航到 。
指定是否要在对象节点中显示对象属性。 如果需要，请指定这些属性。 使用
和 
管理属性列表。
使用您偏好的 Chrome 用户数据启动调试会话
您可能会注意到，您的调试会话会在一个使用自定义 Chrome 用户数据 的新窗口中启动，而不是使用您自己习惯的用户数据。 因此，该窗口看起来与平时不同，例如，您的书签、浏览器历史记录和扩展程序都不见了，这会破坏您的开发体验。 出现这种情况是因为 PyCharm 使用 Chrome 调试协议 ，并使用 --remote-debugging-port 选项运行 Chrome。 但是，如果 Chrome 已启动，则无法为任何使用相同用户数据目录的新建或现有 Chrome 实例打开调试端口。 因此，PyCharm 始终在带有自定义用户数据目录的新窗口中启动调试会话。
要以您熟悉的外观和感觉打开新的 Chrome 实例，请在 PyCharm 中配置 Chrome 以使用您的用户数据目录启动。
在 PyCharm 中配置 Chrome 以使用您偏好的 Chrome 用户数据启动
将您偏好的 Chrome 用户数据 保存在您的计算机上的 与 Chrome 默认用户数据目录 不同的单独自定义目录。
您需要将偏好的用户数据保存在单独的自定义目录中，因为 Chrome 136 及更高版本不支持在默认用户目录中进行调试。 了解详情，请参阅 Chrome 官方网站。
按 Ctrl+Alt+S 打开设置，然后选择 。
要创建新的 Chrome 配置，点击
。 列表中会出现一个新条目。 在 路径 字段中，指定 Chrome 安装文件夹的路径。选择新配置，然后点击 编辑 按钮（
）。在 Chrome 设置 对话框中，选中 使用自定义用户数据目录(U) 复选框，并指定包含您偏好用户数据的自定义目录路径。
如果您有多个 用户数据配置文件 ，每个都存储在单独的子目录中。 要使用某个配置文件，请在 命令行选项 字段中按如下方式指定：
--profile-directory="<profile_to_use>"
按照 选择默认的 PyCharm 浏览器 中的说明，将您的 Chrome 浏览器配置标记为 默认。 在 创建运行/调试配置 时，请不要忘记从 浏览器 列表中选择所需的浏览器。