JavaScript 코드 스타일 점검 도구 비교 : JSLINT, JSHINT, JSC 및 ESLINT
이 기사에서는 프로젝트에 가장 적합한 도구를 선택하는 데 도움이되는 4 가지 인기있는 JavaScript 코드 스타일 확인 도구를 비교하고 분석합니다. 이 도구는 코딩 사양을 따르고 잠재적 오류를 식별하여 코딩 오류를 피하는 데 도움이됩니다.
키 포인트 :
JSLINT, JSHINT, JSCS 및 ESLINT JavaScript 코드 스타일 확인 도구는 JSLINT, JSHINT, JSC 및 ESLINT와 같은 ESLINT JavaScript 코드 스타일 점검 도구가 표준을 인코딩하고 잠재적 오류를 식별하여 코딩 오류를 피하는 데 도움이됩니다. 각 도구에는 고유 한 장점과 단점이 있으며 도구 선택은 프로젝트의 특정 요구에 따라 다릅니다.
jslint는 JavaScript의 좋은 부분을 시행하도록 설계된 가장 오래된 도구입니다. 구성 가능하고 확장 가능하지 않으며 문서가 부족합니다. JSHINT는 JSLINT의 지점으로, 대규모 프로젝트에서 쉽게 구성하고 사용하기 쉽지만 작동하기 위해 약간의 설정이 필요합니다.
JSCS는 잠재적 오류가 아니라 코드 형식에 중점을 둔 코드 스타일 검사기입니다. 90 개가 넘는 규칙이 있으며 사용자 정의 플러그인을 지원합니다. 그러나 다른 도구만큼 유연하지 않으며 4 개 중 가장 느립니다.
eslint는 많은 사용자 정의 규칙을 갖춘 최신 확장 도구입니다. 코드의 오류 및 기타 문제를 확인하므로 저자에게 권장되는 선택입니다. ES6 기능 및 JSX를 지원합니다. 그러나 문서화는 혼란 스러울 수 있으며 일부 구성이 필요합니다.
의 프로그래밍 경험은 여전히 가변 이름의 철자 오류, 문법 오류 및 오류를 올바르게 처리하는 것을 잊어 버리는 것과 같은 몇 가지 저수준 실수를합니다. 우수한 코드 스타일 체커 도구는 시간을 낭비하기 전에 이러한 문제를 발견 할 수 있습니다 (또는 더 나쁘게 클라이언트 시간). 또한 프로젝트가 코딩 사양을 준수하는 데 도움이 될 수 있습니다. -
시장에는 많은 JavaScript 코드 스타일 점검 도구가 있으며 어떻게 선택해야합니까? JSLINT, JSHINT, JSCS 및 ESLINT의 4 가지 대안의 기능과 장점과 단점을 살펴 보겠습니다.
개요 -
이 네 가지 도구는 기본적으로 동일한 방식으로 작동합니다. JavaScript 파일에서 문제를 분석하고보고하기위한 일련의 규칙이 있습니다. NPM을 통해, 파일을 전달하여 명령 줄에서 사용하거나 Grunt와 같은 도구 용 플러그인으로 사용하거나 편집기에 통합 될 수 있습니다. 그들은 모두 주석으로 구성을 지원합니다.
그러나 유사점은 여기서 끝납니다. 각 도구에는 고유 한 장점과 단점이 있습니다. 일부 도구는 단점보다 더 많은 장점이 있다는 것입니다. -
jslint
-
jslint는이 네 가지 도구 중 가장 오래된 것입니다. Douglas Crockford는 2002 년 JavaScript의 좋은 부분이라고 생각하는 것을 목표로 만들었습니다. 이 좋은 부분에 동의하면 JSLINT는 좋은 도구가 될 수 있습니다. 설치하고 사용하십시오.
단점은 jslint가 구성 가능하거나 확장 가능하지 않다는 것입니다. 당신은 단순히 많은 기능을 비활성화 할 수 없으며 그 중 일부는 문서가 부족합니다. 예를 들어 공식 웹 사이트는 그다지 유용하지 않습니다. 예를 들어 편집자와 통합하는 방법에 대한 정보가 부족합니다.
프로 :
구성 후 사용할 준비가되었습니다 (규칙에 동의하는 경우).
단점 :
jslint에는 구성 파일이 없으므로 설정을 변경 해야하는 경우 문제가 될 수 있습니다. -
구성 옵션 수는 제한되어 있으며 많은 규칙을 비활성화 할 수 없습니다.
사용자 정의 규칙을 추가 할 수 없습니다.
기능이 기록되지 않습니다.
어떤 규칙이 어떤 오류를 일으키는 지 알기가 어렵습니다.
jshint
-
Jshint는 JSLINT (JSLINT의 지점)의 구성 가능한 버전으로 만들어졌습니다. 각 규칙을 구성하고 구성 파일에 넣을 수 있으므로 대규모 프로젝트에서 Jshint를 쉽게 사용할 수 있습니다. Jshint는 또한 각 규칙에 대한 좋은 문서를 제공하므로 그들이 무엇을하는지 정확히 알 수 있습니다. 편집기에 통합하는 것도 간단합니다. -
Jshint의 작은 단점은 느슨한 기본 구성이 제공된다는 것입니다. 즉, 작동하도록 설정해야합니다. ESLINT와 비교하여 특정 오류 메시지를 활성화하거나 비활성화하기 위해 어떤 규칙을 변경 해야하는지 알기가 어렵습니다.
프로 : -
대부분의 설정은 구성 가능합니다. -
구성 파일을 지원하여 대규모 프로젝트에서 쉽게 사용할 수 있도록합니다.
jQuery, Qunit, Nodejs, Mocha 등과 같은 많은 라이브러리를 상자에서 지원합니다. -
기본 ES6 지원.
단점 :
어떤 규칙이 오류를 일으키는 지 알기가 어렵습니다.
에는 필수와 휴식 (Jshint를 더 엄격하게 만들거나 경고를 억제하는 데 사용될 수 있음)의 두 가지 유형의 옵션이 있습니다. 이로 인해 구성이 약간 혼란 스러울 수 있습니다.
사용자 정의 규칙은 지원되지 않습니다.
jscs
JSCS는 구성 파일을 제공하거나 사전 설정을 사용하도록 지시하지 않는 한 아무것도하지 않는다는 점에서 다른 도구와 다릅니다. 웹 사이트에서 구성을 다운로드 할 수 있으므로 큰 문제가되지 않으며 jQuery Coding Style Presets 및 Google 사전 설정과 같은 많은 사전 설정이 있습니다.
플러그인을 사용하여 사용자 정의 규칙을 만들 수있는 90 가지가 넘는 규칙이 있습니다. JSC는 또한 사용자 정의보고 프로그램을 지원하므로 특정 형식의 입력이 필요한 도구와 쉽게 통합 할 수 있습니다.
JSCS는 코드 스타일 검사기입니다. 이는 잠재적 오류가 아니라 코드 형식과 관련된 문제만을 포착한다는 것을 의미합니다. 따라서 다른 도구만큼 유연하지는 않지만 JSC는 특정 코딩 스타일을 시행 해야하는 경우 작업을 잘 수행합니다.
프로 :
는 사용자 정의보고 프로그램을 지원하므로 다른 도구와 쉽게 통합 할 수 있습니다. -
사전 설정 및 기성품 구성 파일을 사용하면 사용 가능한 코딩 스타일 중 하나를 따라 가면 쉽게 설정할 수 있습니다.
보고서에 규칙 이름을 포함시킬 수있는 플래그가 있으므로 어떤 규칙이 어떤 오류를 원인인지 쉽게 찾을 수 있습니다. -
사용자 정의 플러그인을 사용하여 확장 할 수 있습니다.
-
단점 :
-
코드 스타일 충돌 만 감지합니다. JSC는 사용하지 않는 변수 또는 예상치 못한 글로벌 변수 등과 같은 잠재적 오류를 감지하지 않습니다.
4 가지 도구 중 가장 느리지 만 일반적인 사용에는 문제가되지 않습니다.
eslint
eslint는이 네 가지 도구 중 최신입니다. 규모가 쉽고 많은 사용자 정의 규칙으로 확장하기 쉽고 플러그인 형식으로 더 많은 규칙을 설치하기 쉽도록 설계되었습니다. 간결한 출력을 제공하지만 기본적으로 규칙 이름을 포함하므로 항상 오류 메시지를 유발하는 규칙을 알고 있습니다. -
eslint 문서는 약간 고르지 않을 수 있습니다. 규칙 목록은 이해하기 쉽고 논리적 범주로 그룹화되지만 구성 지침은 일부 장소에서는 약간 혼란 스럽습니다. 그러나 편집기 통합, 플러그인 및 예제에 대한 링크를 한 곳에서 제공합니다.
프로 : -
유연성 : 모든 규칙을 전환 할 수 있으며 많은 규칙에는 조정할 수있는 추가 설정이 있습니다.
는 매우 확장 가능하며 많은 플러그인이 있습니다.
이해하기 쉬운 출력.
에는 다른 코드 스타일 검사 도구에서 찾을 수없는 많은 규칙이 포함되어있어 Eslint가 문제를 감지하는 데 더 유용합니다.
최고의 ES6 지원 및 JSX를 지원하는 유일한 도구.
사용자 정의보고 프로그램을 지원합니다.
단점 :
에는 약간의 구성이 필요합니다.
속도가 느리지 만 사용을 방해하지는 않습니다.
권장
나는이 네 가지 도구 중에서 eslint를 선택했습니다. JSLINT는 엄격하고 구성 할 수 없으며 JSHINT에는 확장 메커니즘이 부족합니다. 코드 스타일을 확인하려면 JSCS가 좋은 선택이지만 Eslint는 그렇게 할 수 있으며 코드의 오류 및 기타 문제도 확인합니다.
eslint는 ES6 (또는 ES2015가 지금이라고 부르는 것처럼)을 사용하려면 분명한 선택입니다. 언급 된 모든 도구 중에서 ES6 기능을 가장 광범위하게 지원합니다.
eslint를 시도하고 싶다면 5 단계 빠른 시작 가이드를 만들어 단순화했습니다. 내 웹 사이트에서 Eslint 5 단계 빠른 시작 안내서를 다운로드 할 수 있습니다.
jshint는 강력한 두 번째 선택입니다. ESLINT의 고급 기능이 필요하지 않은 경우 JSHINT는 제대로 구성된 후 많은 문제를 해결할 수 있습니다. JSC에는 사용 가능한 규칙이 많이 있으며 코드 스타일 검사 (인센트, 버팀대 등) 만 있으면 훌륭한 옵션입니다. - 나는 JSLINT를 추천하는 것을 망설입니다. 다른 도구는 동일하지만 사용자에게 특정 규칙을 부과하지는 않습니다. 유일한 예외는 모든 규칙에 동의하는 경우,이 경우 조사 할 가치가있을 수 있습니다.
코드 스타일 점검 도구는 문제를 찾는 좋은 방법이지만 규칙이 허용하는 오류 만 찾을 수 있습니다. 보다 자동으로 오류를 포착하려면 단위 테스트를 사용하는 것이 좋습니다. 코드 검토 도이 목적에 도움이 될 수 있습니다.
귀하와 귀하의 팀은 코드의 품질을 어떻게 보장합니까?
JavaScript 코드 스타일 체커 도구에 대한 FAQS
(FAQ 부분은 길이가 너무 길고 의사 원리 목표와 일치하지 않기 때문에 여기서 생략됩니다. FAQ 부품을 필요에 따라 추가하거나 수정할 수 있습니다.)
위 내용은 JavaScript Linting Tools의 비교의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!