Question

我正在调试一个深深嵌套在源树中的Javascript文件。我需要深入记录的URL非常难以记忆，因为我想要的JS源是在由加载项API加载的iFrame中加载的。

有没有办法去＆＃34; pin＆＃34;或＆＃34;书签＆＃34;从Chrome调试器中引用Javascript源代码，因此每次重新加载网页时我都不必深入查看源代码树，只是为了再次返回该源文件？

Answer 1

有几种不同的选择，但没有特定的＆＃34;固定＆＃34; DevTools中的功能。

在“源”选项卡中打开的文件在浏览器会话之间保持不变，因此您可以将其保留在那里而不是关闭它。这是我注意到的第一个显而易见的事情。
如果您知道文件名，请使用 Cmd + O （Mac）/ Ctrl + O （Windows / Linux）打开＆＃39;按文件名搜索＆＃39;框，然后您可以直接打开文件，而不是通过树。
如果您想实际调试文件，请执行Christiaan建议的操作，并在源代码中添加debugger;语句。这将自动在“源”面板中打开文件，并在您放置它的任何行上中断。您也可以使用Chrome的内置断点。这些将一直持续到您禁用或删除它们为止，并且它不涉及修改任何代码。
使用工作区将网络路径（例如，本地或外部运行的服务器）映射到文件系统上的文件夹。您可以选择特定的嵌套文件夹，而不是添加整个应用程序文件夹。然后，它将显示在“源”选项卡的“文件系统”部分中。此时您可以轻松跳转到该文件。这是我刚才提出的，所以没有经过充分测试。

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

在Filesystem部分，我看到该文件夹中使用的所有文件，而不是整个源树。

Answer 2

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

//@ sourceURL=myJavaScriptFile.js

注意：如果在像这样的斜杠“ // @ sourceURL = myJavaScriptFile.js”之后添加空格，它将无法正常工作。 -我以前掉进了那个陷阱。