有没有办法锁定或书签Javascript源文件,以便从Chrome调试器轻松访问?

有没有办法锁定或书签Javascript源文件,以便从Chrome调试器轻松访问?,javascript,google-chrome,google-chrome-devtools,javascript-debugger,Javascript,Google Chrome,Google Chrome Devtools,Javascript Debugger,我正在调试一个深入嵌套在源代码树中的Javascript文件。我必须深入查看的URL非常难以记忆,因为我想要的JS源代码加载在由外接程序API加载的iFrame中 有没有一种方法可以从Chrome调试器中“锁定”或“书签”Javascript源代码的引用,这样我就不必每次重新加载网页时都钻取源代码树以再次返回该源文件?有一些不同的选项,但DevTools中没有特定的“锁定”功能 在“源”选项卡中打开的文件在浏览器会话之间保持不变,因此您可以将其保留在那里而不是关闭。这是我注意到的第一件显而易见的

我正在调试一个深入嵌套在源代码树中的Javascript文件。我必须深入查看的URL非常难以记忆,因为我想要的JS源代码加载在由外接程序API加载的iFrame中


有没有一种方法可以从Chrome调试器中“锁定”或“书签”Javascript源代码的引用,这样我就不必每次重新加载网页时都钻取源代码树以再次返回该源文件?

有一些不同的选项,但DevTools中没有特定的“锁定”功能

  • 在“源”选项卡中打开的文件在浏览器会话之间保持不变,因此您可以将其保留在那里而不是关闭。这是我注意到的第一件显而易见的事情

  • 如果您知道文件名,请使用Cmd+O(Mac)/Ctrl+O(Windows/Linux)打开“按文件名搜索”框,然后您可以直接打开文件而不是通过树打开文件

  • 如果您想实际调试该文件,请按照Christiaan的建议执行,并添加一个
    调试器语句添加到源代码中。这将自动在“源”面板中打开文件,并在您放置的任何行上断开。您也可以只使用Chrome的内置断点。这些将一直存在,直到您禁用或删除它们,并且不涉及修改任何代码

  • 使用工作区将网络路径(例如,本地或外部运行的服务器)映射到文件系统上的文件夹。您可以选择一个特定的嵌套文件夹,而不是添加整个应用程序文件夹。这将出现在Sources选项卡的Filesystem部分。此时,您可以轻松跳转到该文件。这是我刚刚提出的一个,所以没有经过充分测试

    我没有一个很好的例子,但下面我已经映射了css文件夹

  • 在文件系统部分,我看到了该文件夹中使用的所有文件,而不是整个源代码树


    如果您在JavaScript文件的第1行添加以下特殊注释,然后按Ctrl+p搜索并打开它,它将有效地固定在“源”选项卡中,直到您关闭它。即使您关闭DevTools,或者重新启动计算机,或者更新javascript文件,它也会持续存在

    //@ sourceURL=myJavaScriptFile.js
    

    注意:如果在如下“/@sourceURL=myJavaScriptFile.js”这样的斜杠后面添加空格,则它将不起作用。-我以前就掉进过这个陷阱。

    如果你能修改源代码,你可以使用
    调试器?这似乎不适用于webpack,我认为它正在添加自己的源代码映射,真丢脸!