명령줄을 사용하여 JavaScript 코드를 어떻게 아름답게 만들 수 있나요?

StackOverflow https://stackoverflow.com/questions/18985

문제

JavaScript 코드를 아름답게 만들기 위해 배치 스크립트를 작성하고 있습니다.두 가지 모두에서 작동해야 합니다. 윈도우 그리고 리눅스.

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

도움이 되었습니까?

해결책

먼저, 좋아하는 Javascript 기반 Pretty Print/Beautyifier를 선택하세요.나는 에 있는 것을 더 좋아한다 http://jsbeautifier.org/, 왜냐하면 내가 먼저 발견한 것이기 때문입니다.파일을 다운로드합니다. https://github.com/beautify-web/js-beautify/blob/master/js/lib/beautify.js

둘째, Mozilla 그룹의 Java 기반 Javascript 엔진을 다운로드하여 설치합니다. 코뿔소."설치"는 약간 오해의 소지가 있습니다.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는 브라우저 컨텍스트에서는 의미가 없지만 콘솔 컨텍스트에서는 의미가 있는 몇 가지 추가 유용한 기능을 javascript에 제공합니다.print 함수는 여러분이 기대하는 대로 수행하고 문자열을 인쇄합니다.readFile 함수는 파일 경로 문자열을 인수로 받아들이고 해당 파일의 내용을 반환합니다.

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

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

Rhino 실행 스크립트에서 Java와 Javascript를 혼합하고 일치시킬 수 있으므로 Java를 조금이라도 알고 있다면 텍스트 스트림을 사용하여 실행하는 것도 그리 어렵지 않을 것입니다.

다른 팁

nodejs를 사용하고 있다면 시도해보십시오. 추악한 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개의 공백 들여쓰기를 탭으로 변환하려면 이를 통해 실행할 수 있습니다. unexpand Ubuntu 12.04에는 다음이 포함됩니다.

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

아니면 한 번에 모든 작업을 수행할 수도 있습니다.

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

unexpand에 대해 자세히 알아볼 수 있습니다. 여기

그래서 결국 다음과 같은 파일이 생겼습니다.

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

업데이트 2016-06-07

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

2014년 4월 업데이트:

2010년에 제가 답변한 이후로 미화 도구가 다시 작성되었습니다.이제 거기에는 Python 모듈, nodejs용 npm 패키지가 있고 jar 파일은 사라졌습니다.읽어 보시기 바랍니다 github.com의 프로젝트 페이지.

파이썬 스타일:

 $ pip install jsbeautifier

NPM 스타일:

 $ npm -g install js-beautify

그것을 사용하려면:

 $ js-beautify file.js

원래 답변

@Alan Storm의 답변에 추가

명령줄 미화 도구는 다음을 기반으로 합니다. http://jsbeautifier.org/ Rhino(java 기반 JS 엔진, "js.jar"로 패키지됨) 대신 V8 javascript 엔진(c++ 코드)을 기반으로 하기 때문에 사용하기가 조금 더 쉬워졌습니다.따라서 Rhino 대신 V8을 사용할 수 있습니다.

사용하는 방법:

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

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

오래된 (더 이상 작동하지 않으며 jar 파일이 사라졌습니다)

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

새로운 (대체)

svn에서 v8 lib를 설치/컴파일합니다. 위에서 언급한 zip 파일의 v8/README.txt를 참조하세요.

  ./jsbeautify somefile.js

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

- "외부 도구"로 구성하면 Eclipse에서 훌륭하게 작동합니다.

우분투 18.04 LTS에서

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

콘솔에서는 다음을 사용할 수 있습니다. 예술적 스타일 (일명에이스타일)과 함께 --mode=java.
훌륭하게 작동하며 무료이며 오픈 소스이며 크로스 플랫폼(Linux, Mac OS X, Windows)입니다.

승인된 답변에 댓글을 추가할 수 없기 때문에 애초에 존재하지 않아야 할 게시물이 표시되는 것입니다.

기본적으로 자바 코드에 자바스크립트 미화 도구도 필요했는데 놀랍게도 내가 찾을 수 있는 한 아무것도 사용할 수 없었습니다.그래서 나는 허용된 답변을 기반으로 완전히 직접 코딩했습니다(jsbeautifier.org beautifier .js 스크립트를 래핑하지만 java 또는 명령줄에서 호출 가능).

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

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

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

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

자바 코드의 사용법:공개 정적 문자열 jsBeautify(String jsCode, int indentSize)

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

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

구축 방법을 설명하는 기사를 작성했습니다. JavaScript로 구현된 명령줄 JavaScript 뷰티파이어 5분 안에.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 메뉴에서 "코드"->"코드 형식 변경.."을 선택하기만 하면 됩니다.그런 다음 대화 상자에서 "디렉터리의 모든 파일 ..."을 선택하고 "enter"를 누르십시오.JVM에 충분한 메모리를 할당했는지 확인하세요.

최신 JavaScript 방식을 사용하세요.

사용 꿀꿀 거리는 소리 와 결합하여 그런트용 jsbeautifier 플러그인

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

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

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top