google-chrome-devtools - 在计算机之间导入/导出Chrome devtools断点和设置

Question

引用the original idea:

I came across a problem where I need to share all my debugger breakpoints to my colleague to debug the issue at his end. So thought of implementing something like export the debugger points from one system and import at other system.

由于devtools不提供内置的导入/导出功能，因此还有另一种方法吗？

Answer 1

使用devtools-on-devtools:

打开 devtools ，并将其在菜单中的Dock side切换到一个分离的( float 的)窗口

在现已分离的devtools中的

中，在MacOS上按CtrlShifti或⌘⌥i，
它将在新窗口中打开 devtools-on-devtools

UI方法:

在这个新窗口中的

切换到Application选项卡，展开Local Storage，然后在左侧

上展开 devtools://devtools

双击右侧的breakpoints值并将其复制粘贴

现在在目标计算机上执行相同的操作，然后重新打开主devtools窗口。

控制台方法(在值太长的情况下特别有用):

在源计算机上的devtools-on-devtools控制台中运行copy(localStorage.breakpoints)，以将值复制到剪贴板

在目标计算机上运行localStorage.breakpoints=prompt()(提示将出现在devtools主窗口中)。

导出所有内容的控制台方法:

在源计算机上的devtools-on-devtools控制台中运行copy(JSON.stringify(localStorage))，以将值复制到剪贴板

在目标计算机上运行Object.assign(localStorage, JSON.parse(prompt()))(提示将出现在devtools主窗口中)。

P.S.下次您可以通过按CtrlShiftD快速切换devtools的分离状态