JavaScript 코드를 아름답게하기 위해 배치 스크립트를 작성하고 있습니다. Windows 와 Linux 모두에서 작동해야합니다 .

명령 줄 도구를 사용하여 JavaScript 코드를 어떻게 아름답게 만들 수 있습니까?

먼저, 선호하는 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를 사용하여 자바 스크립트 파일을 읽고 1 단계의 Pretty Print / Beautifier를 통해 실행할 작은 셸 스크립트를 작성합니다. 예를 들면

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

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

Rhino는 브라우저 컨텍스트에서는 의미가 없지만 콘솔 컨텍스트에서는 작동하는 몇 가지 유용한 기능을 자바 스크립트에 제공합니다. print 함수는 예상 한대로 수행하고 문자열을 인쇄합니다. readFile 함수는 파일 경로 문자열을 인수로 받아들이고 해당 파일의 내용을 반환합니다.

위의 내용을 다음과 같이 호출합니다.

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

Rhino 실행 스크립트에서 Java와 Javascript를 혼합하고 일치시킬 수 있으므로 약간의 Java를 알고 있다면 텍스트 스트림으로도 실행하는 것이 너무 어렵지 않습니다.

2014 년 4 월 업데이트 :

미화 기는 2010 년에 대답 한 이후로 다시 작성되었습니다. 이제 거기에는 파이썬 모듈이 있고 nodejs 용 npm 패키지가 있으며 jar 파일은 사라졌습니다. github.com 에서 프로젝트 페이지를 읽어 보세요 .

Python 스타일 :

 $ pip install jsbeautifier

NPM 스타일 :

 $ npm -g install js-beautify

그것을 사용하려면 :

 $ js-beautify file.js

원래 답변

@Alan Storm의 답변에 추가

http://jsbeautifier.org/ 를 기반으로하는 명령 줄 미화 기는 사용하기가 조금 더 쉬워졌습니다. rhino (자바 기반 JS 엔진, 패키지화) 대신 V8 자바 스크립트 엔진 (c ++ 코드)을 기반으로하기 때문입니다. "js.jar"). 따라서 rhino 대신 V8을 사용할 수 있습니다.

사용하는 방법:

http://github.com/einars/js-beautify/zipball/master 에서 jsbeautifier.org zip 파일을 다운로드하십시오.

( http://download.github.com/einars-js-beautify-10384df.zip 과 같은 zip 파일에 링크 된 다운로드 URL입니다. )

이전 (더 이상 작동하지 않음, jar 파일이 사라짐)

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

신규 (대안)

svn에서 v8 lib 설치 / 컴파일, 위에서 언급 한 zip 파일의 v8 / README.txt 참조

  ./jsbeautify somefile.js

-rhino 버전과 약간 다른 명령 줄 옵션이 있습니다.

-그리고 "외부 도구"로 구성된 경우 Eclipse에서 훌륭하게 작동합니다.

nodejs를 사용하는 경우 uglify-js 를 사용해보십시오

Linux 또는 Mac에서 이미 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 칸 들여 쓰기를 탭으로 변환하려면 unexpandUbuntu 12.04와 함께 제공되는 탭을 실행할 수 있습니다 .

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

또는 한 번에 모든 작업을 수행 할 수 있습니다.

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

여기에서 확장 해제에 대해 자세히 알아볼 수 있습니다.

그래서 결국 나는 다음과 같은 파일로 끝납니다.

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

업데이트 2016-06-07

설치는 동일하지만 uglify-js의 관리자는 현재 버전 2에서 작업하는 것으로 보입니다 .

Ubuntu LTS에서

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

콘솔에서 Artistic Style (일명 AStyle)을 --mode=java.
훌륭하게 작동하며 무료, 오픈 소스 및 크로스 플랫폼 (Linux, Mac OS X, Windows)입니다.

최신 JavaScript 방식을 사용하십시오.

사용 그런트 와 함께 그런트에 대한 jsbeautifier 플러그인

npm을 사용하여 모든 것을 개발 환경에 쉽게 설치할 수 있습니다 .

필요한 것은 파일 연결, lint, uglify, minify 등을 포함 할 수도있는 적절한 작업으로 Gruntfile.js를 설정하고 grunt 명령을 실행하는 것입니다.

수락 된 답변에 댓글을 추가 할 수 없기 때문에 처음에는 존재하지 말았어야 할 게시물이 표시됩니다.

기본적으로 자바 코드에 자바 스크립트 미화 기가 필요했고 놀랍게도 내가 찾을 수있는 한 사용할 수있는 것은 없습니다. 그래서 나는 전적으로 받아 들여진 대답을 기반으로 하나를 코딩했습니다 (jsbeautifier.org beautifier .js 스크립트를 래핑하지만 java 또는 명령 줄에서 호출 가능).

코드는 https://github.com/belgampaul/JsBeautifier에 있습니다.

rhino와 beautifier.js를 사용했습니다.

콘솔에서 사용 : java -jar jsbeautifier.jar 스크립트 들여 쓰기

예 : java -jar jsbeautifier.jar "function ff () {return;}"2

자바 코드에서 사용 : public static String jsBeautify (String jsCode, int indentSize)

코드를 확장 할 수 있습니다. 제 경우에는 들여 쓰기 만 필요했기 때문에 개발 중에 생성 된 자바 스크립트를 확인할 수있었습니다.

프로젝트에서 시간을 절약 할 수 있기를 바랍니다.

5 분 이내에 JavaScript 로 구현 된 명령 줄 JavaScript 미화기를 빌드하는 방법을 설명하는 기사를 작성했습니다 . YMMV.

1. 안정적인 최신 Rhino를 다운로드하고 어딘가에 압축을 풉니 다. 예 : ~ / dev / javascript / rhino
2. 앞서 언급 한 jsbeautifier.org에서 참조 된 beautify.js를 다운로드 한 다음 어딘가에 복사합니다. 예 : ~ / dev / javascript / bin / cli-beautifier.js

3. beautify.js 끝에 다음을 추가합니다 (JavaScript에 몇 가지 추가 최상위 속성 사용).

   // Run the beautifier on the file passed as the first argument.
   print( j23s_beautify( readFile( arguments[0] )));

4. 실행 파일에 다음 코드를 복사하여 붙여 넣습니다 (예 : ~ / 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 $*

5. (선택 사항) jsbeautifier.js가있는 폴더를 PATH에 추가하거나 이미있는 폴더로 이동합니다.

명령 줄 도구에 대해 물었을 때 모든 js 파일을 일괄 적으로 아름답게 만들고 싶었습니다.

이 경우 Intellij IDEA (11.5로 테스트 됨)가이를 수행 할 수 있습니다.

프로젝트 파일을 선택하고 메인 IDE 메뉴에서 "코드"-> "코드 재 형식화 .."를 선택하기 만하면됩니다. 그런 다음 대화 상자에서 "디렉토리의 모든 파일 ..."을 선택하고 "입력"을 누르십시오. JVM에 충분한 메모리를 할당했는지 확인하십시오.

몇 가지 라이너를 선택할 수 있습니다. npm과 함께 사용하거나 npx 와 함께 독립형으로 사용하십시오 .

세미 스탠 다

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

표준

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

예쁘다

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