codecamp

配置JavaScript调试器

配置JavaScript调试器

通过JavaScript Debugger插件支持在IntelliJ IDEA中调试JavaScript 。该插件默认激活。如果插件已禁用,请在插件设置页面上启用它。

Google Chrome和Chrome系列的其他浏览器支持调试JavaScript代码。

为确保成功调试,只需指定内置Web服务器端口并接受IntelliJ IDEA为其他调试器选项建议的默认设置即可。

设置内置Web服务器端口

  1. 在“设置/首选项”对话框(Ctrl+Alt+S)中,单击“构建,执行,部署”下的“调试器” 。将打开“调试器”页面。
  2. 在“内置服务器”区域中,指定内置Web服务器运行的端口。默认情况下,此端口设置为默认的IntelliJ IDEA端口63342,IntelliJ IDEA通过该端口接受来自服务的连接。您可以将端口号设置为以1024及更高版本开头的任何其他值。
    如果启用了实时编辑功能,JetBrains Chrome扩展程序也将使用此端口连接到正在运行的页面。

可选

  • 通过分别清除“可以接受外部连接”或“允许未签名的请求”复选框,禁止从其他计算机或外部IntelliJ IDEA对内置服务器上的文件进行调用。
  • 选择删除断点的方法,默认设置为“单击”。
  • 在“调试器”节点下的“数据视图”页面上,配置高级调试器选项:启用或禁用内联调试,指定何时查看具有对象值和表达式计算结果的工具提示等。
  • 单击“数据视图”节点下的JavaScript,然后在打开的JavaScript页面上,指定以下内容:
    • 是否要显示对象节点属性。如果是,请指定属性。使用图标一般添加svg图标一般删除svg管理属性列表。

使用默认Chrome用户数据启动调试会话

您可能会注意到,您的调试会话将在新窗口中启动,其中包含自定义Chrome用户数据,而不是默认用户数据。因此,窗口看起来很不寻常,例如,您的书签,浏览器历史记录和扩展程序都缺失,这些都会破坏您的开发体验。之所以会发生这种情况,是因为IntelliJ IDEA使用Chrome调试协议,并使用Chrome运行Chrome--remote-debugging-port选项。但是,如果Chrome已启动,则无法为具有相同用户数据的任何新的或现有的Chrome实例打开调试端口。因此,使用Chrome调试协议时,IntelliJ IDEA始终在带有自定义用户数据的新窗口中启动调试会话。

概要

  • 要在同一个Chrome实例中启动调试会话,请像以前一样使用JetBrains Chrome扩展程序。
  • 要使用您熟悉的外观打开新的Chrome实例,请在IntelliJ IDEA中配置Chrome以开始使用您的用户数据。在这种情况下,在开始调试会话之前,请务必确保Chrome尚未运行您的用户数据。否则,IntelliJ IDEA仍会使用您的用户数据启动另一个Chrome实例,但无法为其打开调试端口。因此,IntelliJ IDEA调试器无法连接到新Chrome实例中的应用程序,并且调试会话无法启动。

在IntelliJ IDEA中配置Chrome以开始使用Chrome用户数据

  1. 将Chrome用户数据保存在计算机的任何位置。
  2. 在“设置/首选项”对话框(Ctrl+Alt+S)中,单击“工具”下的“Web浏览器”。将打开“Web浏览器”页面。
  3. 要创建新的Chrome配置,请点击图标一般添加。列表中将显示一个新项目。在“Path”字段中,指定Chrome安装文件夹的路径。
  4. 选择新配置并单击图标操作编辑svg。Chrome设置对话框随即打开。
  5. 选择“使用自定义用户数据目录”复选框并在IntelliJ IDEA设置中指定到您的用户数据目录的路径。
  6. 如“选择默认的IntelliJ IDEA浏览器”中所述,标记您的Chrome浏览器配置默认设置,并且在创建运行/调试配置时不要忘记从浏览器列表中选择默认值。

使用JetBrains Chrome扩展程序进行调试

  • 安装扩展并配置实时编辑功能,如“HTML,CSS和JavaScript中的实时编辑”中所述。
IntelliJ IDEA:创建JSDoc注释
调试部署到远程服务器的JavaScript
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

IntelliJ IDEA的一般准则

什么是IntelliJ IDEA项目

使用IntelliJ IDEA的意图行为

IntelliJ IDEA使用运行/调试配置

特定于VCS的程序

IntelliJ IDEA语言和特定框架指南

IntelliJ IDEA的数据库和SQL功能

IntelliJ IDEA使用之JavaServer Faces(JSF)

IntelliJ IDEA:分析PHP应用程序的性能

IntelliJ IDEA:调试PHP应用程序

IntelliJ IDEA:适用于PHP的Google App Engine

IntelliJ IDEA更多内容

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }