WebStorm中的断点不适用于JavaScript调试

MrD*_*Duk 10 javascript remote-debugging intellij-idea run-configuration webstorm

我在WebStorm中进行了以下配置设置:

在此输入图像描述

当我点击调试时,它会很好地启动Chrome并导航到该页面,但我的断点永远不会受到影响.它以某种方式连接,因为我看到console.log()了WebStorm中的所有输出.

我正在尝试导航到屏幕截图中指定的URL并且在main.js命中时有断点,但是它没有按预期工作(参见:at).我不确定我错过了什么.我已经尝试main.js远程URL部分中为特定文件设置远程URL,但这也没有帮助.

作为参考,我通过bra run和运行应用程序npm run watch.

快速更新

所以我已经能够实际获得一个断点,但它位于不同的文件中(在不同的路径中):

../public/app/core/routes/dashboard_loaders.ts允许我在断点处停下来,但../public/dashboards不是.

在此输入图像描述

当我导航到http:// localhost:3000/dashboard/script/main.js?orgId = 1时,它会命中路径:

.when('/dashboard/:type/:slug', {
    templateUrl: 'public/app/partials/dashboard.html',
    controller : 'LoadDashboardCtrl',
    reloadOnSearch: false,
    pageClass: 'page-dashboard',
  })
Run Code Online (Sandbox Code Playgroud)

最终加载文件../public/dashboards/multi.js- 但没有命中断点.

进一步更新

看起来脚本是通过以下命令(in ../public/app/features/dashboard/dashboardLoaderSrv.js)提供的:

/*jshint -W054 */
var script_func = new Function('ARGS','kbn','dateMath','_','moment','window','document','$','jQuery', 'services', result.data);
var script_result = script_func($routeParams, kbn, dateMath, _ , moment, window, document, $, $, services);
Run Code Online (Sandbox Code Playgroud)

哪里$routeParamstype:scriptslug:main.js-如果我踏进这个功能,我得到一个匿名的文件,该文件等同于我的实际(?)main.js的文件,但名称是一样43550,而不是main.js-我认为这是熬煮至缺乏基本的知识如何的JavaScript处理我的一些事情.:)

pup*_*pet 1

编辑:我发现使用 webstorm 和 grafana 出现这个问题(第二次编辑),看起来这就是你。我认为他链接的内容通过声明 sourceUrl 来解决这个问题,然后您的文件不是“匿名”或者是动态的。

//# sourceURL=filename.js
Run Code Online (Sandbox Code Playgroud)

IE

//# sourceURL=main.js
Run Code Online (Sandbox Code Playgroud)

参考如何在浏览器的调试器本身中调试动态加载的 JavaScript(使用 jQuery)?


以下是有关在 webstorm 中进行调试的文档和视频,以确保一切设置正确。(IE 我的默认设置是调试我的索引文件而不是我的项目)。确保您有Chrome 扩展程序Firefox 扩展程序

Webstorm 中的常规 JS 调试

在 Webstorm 中调试 Chrome

在 Webstorm 中调试 Firefox

在 Webstorm 中调试 Node.JS