在铬开发工具中调试plunker

Question

我在Plunker中创建了一个JavaScript文件，我想调试它。当我打开“Sources”面板时，我看不到我创建的js文件。我只看到很多Plunker js文件。请指教。谢谢

Answer 1

您有两个主要选项可深入到您创建的源文件。

1.使用预览面板的弹出窗口模式

默认情况下，预览的plunker Web应用程序内的内部运行。您可以通过单击预览窗口右上角的蓝色展开图标，让plunker在单独的窗口中显示预览器。如果您为弹出窗口打开开发工具，则只能看到您的源文件。

右键单击预览并打检查元件

做这种方式可以让您使用嵌入式，实时预览，并会给你一个快捷方式向下钻取到关联的DOM您码。

Answer 2

另一种方法是把这个在你的JavaScript文件

调试;

并使控制台保持打开状态，这将强制调试器不仅在那里停止，而且还打开文件。

Answer 3

这可能会改变，但目前在Chrome 47.0.2526.111 M于窗10，64位，这是你可以找到你的普拉克源文件：

• 开放的开发工具（F12）
• 公开消息
• 查找run.plnkr.co
• 展开这表明一个可怕ctory有一个神秘的名字

里面，你会发现你的文件，这样你就可以开始调试

Answer 4

更快的方法，我发现是简单地抓住唯一ID您plnk的。

在正常'编辑'模式URL将会像

http://plnkr.co/edit/P0fqZG6G6khKKrtfBkDP?p=preview

这ID只需追加 - P0fqZG6G6khKKrtfBkDP到URL

http://run.plnkr.co/plunks/因此成为

http://run.plnkr.co/plunks/P0fqZG6G6khKKrtfBkDP/

重要：使双确保添加后/

• Open new URL in a new chrome window
• Hit F12 in chrome, voila native angular JS debugging for your plnk

注意：然后，您可以继续在plnkr中进行编辑，保存并在调试时刷新此URL，以维护活动的调试会话。

Answer 5

该图片胜过千言万语...... F12然后选择来源; plunkerPreviewTarget有源代码