Chrome开发人员工具中的人类可读JavaScript

142

有人知道Chrome开发者工具是否可以将javascript格式化为可读格式？某种美化器会很方便。假设我正在使用一些JS库，并且需要实例化它的对象，这样我就应该知道要在构造函数中放入什么。但是，在Chrome开发者工具用户界面中搜索包含4行的庞大库时，这很烦人...

否则，服务器端需要注意实现“开发模式”，该模式提供未压缩的javascript文件...

javascript google-chrome-devtools

— 里萨克
source

我敢肯定那是不可能的，但是我希望我错了，因为这将是一个不错的功能。

— Zevan 2010年

我做到了，但是缺少此功能非常令人惊讶，所以我在这里问得更好

— lisak 2010年

Firebug的版本：stackoverflow.com/questions/4279319/...

— 西罗桑蒂利郝海东冠状病六四事件法轮功

Answers:

331

某些浏览器具有如下所示的“ 漂亮打印”按钮{}，根据浏览器的不同，它会显示为HTML，JS和/或CSS。

Chrome在“ 来源”标签中具有它：

Chrome 40漂亮的打印按钮

Firefox在“ 调试器”选项卡中的

Firefox 35美化来源按钮：

这些按钮的位置可能会改变，但是应该始终在其中

— fgm2r
source

在Windows上，它是一个类似于-> {}的小图标。标题上写着Pretty Print。

— omninonsense 2011年

@with感谢您提及。我想知道为什么他们在Windows / Mac OS上以不同的方式实现它。

— fgm2r 2011年

有人知道这个Chrome功能发生了什么吗？我想我以前在Chrome浏览器中看到过这种情况，但现在看来已经不见了。

— superjos 2012年

@superjos他们已经将其更改为现在在Mac OS和Windows上相同。

— fgm2r 2012年

嗯，但是我什至无法在上下文菜单中看到它。仅存在“检查项目”命令。见截图。

— superjos 2012年

至少在Windows上的“脚本”选项卡中没有“漂亮打印”图标（看起来像：{}）吗？

— 无所不知
source

有http://jsbeautifier.org/供在线使用（您需要复制/粘贴）。

在该站点上，他们有一个链接到fiddler（一个Web调试代理）和一个JavaScript Formatter（第三个扩展）。

— 加布里埃莱·彼得里奥利（Gabriele Petrioli）
source