源映射监视器工具

使用 源地图监视器 工具来监视网页上的哪些源文件请求加载源映射,以及是否加载了源映射。 如果网页使用源映射将重新处理的代码映射到原始源代码,则此工具非常有用。 源映射 使你能够查看和调试原始源代码,而无需使用服务器返回的代码的重新处理版本。

若要尝试此功能,请执行以下操作:

  1. 在新选项卡或窗口中,按照 将已处理的代码映射到原始源代码中的说明进行调试,然后继续下方操作。

  2. 关闭演示打开的弹出对话框。

  3. “源” 工具的“ 页面 ”选项卡中,选择演示为你创建的文件,例如 Coffee2.js

  4. 在 DevTools 的main工具栏上,单击“更多工具 (更多工具”图标) 按钮,然后选择“源映射监视器”工具。

    源映射监视器工具

排除项和包含项

源映射监视器工具显示已尝试或尚未尝试的 URL 查找,如 DevTools 设置>符号服务器>筛选器行为中的筛选器设置中的配置。 例如:

  1. 右键单击网页,然后选择“ 检查”。 DevTools 随即打开。

  2. 单击“DevTools) ”的“设置” (“设置”图标按钮,然后选择“符号服务器”。

  3. “筛选器行为 ”下拉列表中,选择“ 排除列表 ” (,或者选择“ 包含列表) ”。 如果未显示 “筛选器行为 ”下拉列表,请设置 符号服务器 设置,如以下文章中所述:

  4. “筛选行为 ”文本框中,输入包含通配符的域,以排除 (或包括) ,例如: https://ryanseddon.com/*

  5. 关闭 DevTools 设置

  6. 在 DevTools 中,选择 “源映射监视器 ”工具。

    源映射监视器工具现在指示排除 (,或者,包括) 源映射 URL 查找尝试:

源映射监视器工具指示已尝试的源映射 URL 查找

另请参阅