在Ubuntu 18.04 LTS上

Question

我正在编写批处理脚本以美化JavaScript代码。它需要在 Windows 和 Linux 上工作。

如何使用命令行工具美化JavaScript代码？

Answer 1

首先，选择你喜欢的基于Javascript的Pretty Print / Beautifier。我更喜欢 http://jsbeautifier.org/的那个，因为这是我先找到的。下载文件https://github.com/beautify-web/js-beautify/blob/master/js/lib/beautify.js

其次，下载并安装Mozilla组基于Java的Javascript引擎Rhino。 “安装”有点误导;下载zip文件，解压缩所有内容，将js.jar放在Java类路径中（或OS X上的Library / Java / Extensions）。然后，您可以使用类似于此

的调用来运行脚本

java -cp js.jar org.mozilla.javascript.tools.shell.Main name-of-script.js

使用步骤1中的Pretty Print / Beautifier编写一个小的shell脚本，该脚本将在您的javascript文件中读取并通过第一步中的Pretty Print / Beautifier运行它。例如

//original code    
(function() { ... js_beautify code ... }());

//new code
print(global.js_beautify(readFile(arguments[0])));

Rhino为javascript提供了一些额外的有用功能，这些功能在浏览器上下文中不一定有意义，但在控制台上下文中也是如此。函数print执行您期望的操作，并打印出一个字符串。函数readFile接受文件路径字符串作为参数，并返回该文件的内容。

你会调用上面的内容，比如

java -cp js.jar org.mozilla.javascript.tools.shell.Main beautify.js file-to-pp.js

你可以在你的Rhino运行脚本中混合搭配Java和Javascript，所以如果你知道一点Java，那么运行文本流也不会太难。

Answer 2

如果您正在使用nodejs，请尝试uglify-js

在Ubuntu 12.04上，假设您已经安装了nodejs，可以使用以下命令安装uglify：

sudo npm install -g uglify-js

然后得到选项：

uglifyjs -h

因此，如果我有一个源文件foo.js，如下所示：

// foo.js -- minified
function foo(bar,baz){console.log("something something");return true;}

我可以像这样美化它：

uglifyjs foo.js --beautify --output cutefoo.js

uglify默认使用空格进行缩进，所以如果我想将4空格缩进转换为制表符，我可以通过Ubuntu 12.04附带的unexpand运行它：

unexpand --tabs=4 cutefoo.js > cuterfoo.js

或者你可以一气呵成：

uglifyjs foo.js --beautify | unexpand --tabs=4 > cutestfoo.js

您可以找到有关unexpand here

的更多信息

所以在这之后我结束了一个看起来像这样的文件：

function foo(bar, baz) {
    console.log("something something");
    return true;
}

更新2016-06-07

uglify-js的维护者现在正在使用version 2，但安装是相同的。

Answer 3

2014年4月更新：

自从我在2010年回答这个问题以来，美化器已被重写。现在有一个python模块，一个用于nodejs的npm包，并且jar文件已经消失。请阅读project page on github.com。

Python风格：

 $ pip install jsbeautifier

NPM风格：

 $ npm -g install js-beautify

使用它：

 $ js-beautify file.js

原始回答

添加@Alan Storm的答案

基于http://jsbeautifier.org/的命令行美化已经变得更容易使用，因为它现在（或者）基于V8 javascript引擎（c ++代码）而不是rhino（基于java的JS引擎，打包）作为“js.jar”）。所以你可以使用V8而不是rhino。

使用方法：

从jsbeautifier.org下载zip文件 http://github.com/einars/js-beautify/zipball/master

（这是一个链接到zip文件的下载网址，例如http://download.github.com/einars-js-beautify-10384df.zip）

old（不再有效，jar文件消失了）

  java -jar js.jar  name-of-script.js

新（替代）

安装/编译v8 lib FROM svn，参见上述zip文件中的v8 / README.txt

  ./jsbeautify somefile.js

- 与rhino版本的命令行选项略有不同，

- 在配置为“外部工具”

时，在Eclipse中运行良好

Answer 4

在Ubuntu 18.04 LTS上

$ sudo apt install jsbeautifier
$ js-beautify ugly.js > beautiful.js

Answer 5

我无法在接受的答案中添加评论，这就是为什么你会看到一个本来不应该存在的帖子。

基本上我还需要一个java代码中的javascript美化器，令我惊讶的是，据我所知，没有一个可用。所以我完全基于接受的答案编写了一个（它包装了jsbeautifier.org美化.js脚本，但可以从java或命令行调用）。

代码位于https://github.com/belgampaul/JsBeautifier

我使用了rhino和beautifier.js

来自控制台的使用：java -jar jsbeautifier.jar脚本缩进

示例：java -jar jsbeautifier.jar“function ff（）{return;}”2

来自java代码的USAGE： public static String jsBeautify（String jsCode，int indentSize）

欢迎您扩展代码。在我的情况下，我只需要缩进，这样我就可以在开发时检查生成的javascript。

希望它能为你节省一些时间。

Answer 6

在控制台中，您可以将Artistic Style（a.k.a。AStyle）与--mode=java一起使用。
它运行良好，它是免费的，开源的和跨平台的（Linux，Mac OS X，Windows）。

Answer 7

您有几种班轮选择。与npm一起使用，或与npx一起使用。

Semistandar

npx semistandard "js/**/*.js" --fix

Standard

npx standard "js/**/*.js" --fix

Prettier

npx prettier --single-quote --write --trailing-comma all "js/**/*.js"

Answer 8

我写了一篇文章，解释了如何在5分钟内构建command-line JavaScript beautifier implemented in JavaScript。 YMMV。

下载最新的稳定Rhino并将其解压缩到某处，例如〜的/ dev / JavaScript的/犀牛

下载从上述jsbeautifier.org引用的beautify.js然后将其复制到某处，例如〜的/ dev / JavaScript的/ bin中/ CLI-beautifier.js
在beautify.js的末尾添加它（使用一些额外的顶级属性到JavaScript）：
// Run the beautifier on the file passed as the first argument.
print( j23s_beautify( readFile( arguments[0] )));
将以下代码复制粘贴到可执行文件中，例如〜的/ dev / JavaScript的/ bin中/ jsbeautifier.sh：
#!/bin/sh
java -cp ~/dev/javascript/rhino/js.jar org.mozilla.javascript.tools.shell.Main ~/dev/web/javascript/bin/cli-beautifier.js $*
（可选）将带有jsbeautifier.js的文件夹添加到PATH或移动到已存在的某个文件夹。

Answer 9

我相信当您询问命令行工具时，您只想批量美化所有js文件。

在这种情况下，Intellij IDEA（用11.5测试）可以做到这一点。

您只需选择任何项目文件，然后在主IDE菜单中选择“代码” - >“重新格式代码..”。然后在对话框中选择“目录中的所有文件...”并按“输入”。只需确保为JVM提供足够的内存。

Answer 10

使用现代JavaScript方式：

将Grunt与jsbeautifier plugin for Grunt

结合使用

您可以使用npm轻松地将所有内容安装到您的开发环境中。

您需要的只是设置一个带有相应任务的Gruntfile.js，它还可以包含文件串联，lint，uglify，minify等，并运行grunt命令。

如何使用命令行美化JavaScript代码？

10 个答案:

在Ubuntu 18.04 LTS上