Javascript chrome 开发人员工具中的人类可读 javascripts

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4484407/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 12:36:29  来源:igfitidea点击:

Human readable javascripts in chrome developer tools

javascriptgoogle-chrome-devtools

提问by lisak

does anybody know whether Chrome Developer Tools can format javascripts into human readable form ? Some kind of beautifier would be handy. Let say that I'm using some JS library and I need to instantiate its object, so that I should know what to put into constructor. But searching through this huge library that has 4 lines in the Chrome Developer Tools user interface is quite annoying...

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

Otherwise the server side needs to take care of implementing "dev mode" that supplies javascript files that are not minified ...

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

回答by fgm2r

Some browsers have a Pretty printbutton that looks like this {}and it appears for HTML, JS, and/or CSS depending on the browser.

一些浏览器有一个漂亮的打印按钮,看起来像这样{},它出现在 HTML、JS 和/或 CSS 中,具体取决于浏览器。

Chrome has it in the in the Sourcestab:

Chrome 在Sources选项卡中有它:

Chrome 40 pretty print button

Chrome 40 漂亮的打印按钮

Firefox has it in the in the Debuggertab

Firefox 在Debugger选项卡中有它

Firefox 35 prettify source button:

Firefox 35 美化源按钮

The position of these buttons may change, but it should always be in there

这些按钮的位置可能会改变,但应该始终在那里

回答by omninonsense

Isn't there the Pretty Print icon (looks like: { }), at least on Windows there is one, within the Scripts tab?

是不是有漂亮的打印图标(看起来像:{}),至少在 Windows 上有一个,在脚本选项卡中?

回答by Gabriele Petrioli

There is the http://jsbeautifier.org/for online usage (you need to copy/paste).

http://jsbeautifier.org/供在线使用(您需要复制/粘贴)。

On that site they have a link to fiddler(a web debugging proxy) and a JavaScript Formatterfor it (3rd extention).

在那个站点上,他们有一个指向fiddler一个网络调试代理)的链接和一个JavaScript Formatter第三个扩展)。