코드 최적화를위한 10 개의 CSS 및 JavaScript linting 도구
Linting 도구는 개발자가 좋은 품질, 최적화 된 코드 작성. Linting은 소스 코드에서 오류를 찾고 가능한 버그를 표시하는 코드 검사 프로세스입니다. 대부분의 linter는 정적 코드 분석 기법을 사용합니다. 코드는 실제로 실행되지 않고 검사된다..
코드를 작성하는 동안, 파일을 저장할 때, 변경 사항을 커밋 할 때 또는 코드가 제작되기 전에 실시간으로 보류 할 수 있습니다. 워크 플로우가 어떻든간에 중요한 것은 정기적으로 보푸라기가있다., 앞으로도 많은 두통으로부터 당신을 구할 수 있기 때문에.
Linters는 버그 방지 도구 일뿐만 아니라 디버깅 중에도 효과적으로 사용할 수 있습니다 잡기가 어려운 오류를 찾으려면 그렇지 않으면. 이 글에서는 코드의 품질을 향상시키기 위해 CSS 및 JavaScript 파일을 보완하는 데 사용할 수있는 10 개의 강력한 linting 도구를 살펴 보겠습니다..
1. CSSLint
CSSLint는 분명히 당신의 감정을 상하게하려는 의도가 있지만 교환으로 "코드를 훨씬 잘 만들게"합니다. CSSLint는 현재 CSS linting의 시장을 주도하고 있습니다. 그것은 자바 스크립트로 작성되었으며, 오픈 소스이며 구성 가능한 옵션이 수없이 많습니다..
CSSLint를 사용하면 어떤 종류의 오류 및 경고 선택 (호환성, 성능, 복제 등) 당신은 시험하고 싶다., 과 선택할 규칙에 따라 CSS 구문의 유효성을 검사합니다..
브라우저에서 작동 할뿐만 아니라 명령 줄 인터페이스도 있으며 자체 빌드 시스템에도이 인터페이스를 통합 할 수 있습니다..
2. SublimeLinter CSSLint
CSSLint는 효과적인 CSS 링크입니다. 경쟁자를 찾아내는 것이 어렵습니다. 아마도 SublimeLinter linting 프레임 워크가 그 위에 CSS linting 플러그인을 만든 이유 일 것입니다. SublimeLinter는 SublimeText 플러그인입니다. SublimeText edito 내부에서 코드 (CSS, PHP, Python, Java, Ruby 등)를 보완 할 수있는 수단을 사용자에게 제공합니다.아르 자형.
SublimeLinter CSSLint 플러그인 자체를 설치하기 전에 CSSLint를 Node.js 모듈로 설치해야합니다. 이 편리한 도구의 가장 큰 장점은 한 번만 설정을 구성하면됩니다., 기본 설정이 만족스럽지 않아도 그렇게하지 않아도된다면 SublimeText 편집기에서 관련 경고 및 알림을 더 이상 번거 로움없이 얻을 수 있습니다.
3. StyleLint
StyleLint는 개발자가 CSS, SCSS 또는 PostCSS가 구문 분석 할 수있는 기타 구문의 오류를 방지 할 수 있도록 도와줍니다. StyleLint는 100 개가 넘는 규칙을 테스트하고 전환 할 항목을 선택하십시오. (예제 설정 참조).
자신 만의 구성을 만들고 싶지 않은 경우 약 60 개의 StyleLint 규칙이 포함 된 미리 작성된 표준 구성을 선택할 수도 있습니다. StyleLint는 매우 유연한 도구이며 별도의 플러그인으로 확장 할 수 있으며 명령 줄 도구, Node.js 모듈 또는 PostCSS 플러그인으로 사용됩니다..
4. W3C CSS Validator
W3C의 CSS Validator는 일반적으로 linting tool로 간주되지 않지만 개발자는 CSS 소스 코드를 W3C의 공식 표준과 비교할 수있는 좋은 기회를 제공합니다. W3C는 C 언어 용 Lint 프로그램 검사기와 유사한 도구를 제공하기 위해 유효성 검사기를 만들었습니다..
처음에는 HTML 마크 업 검사기를 작성한 다음 나중에 CSS 검사기를 사용했습니다. W3C의 CSS 검사기에는 CSSLint만큼 많은 옵션이 없지만 상세하고 이해하기 쉬운 오류 메시지 및 알림을 반환합니다..
추가 기능으로, W3C의 최근 모바일 웹 표준에 대한 코드를 확인할 수도 있습니다. 이는 모바일 웹 시대에 나쁜 점이 아닙니다..
5. 더러운 마크 업
Dirty Markup은 HTML, CSS 및 JavaScript 코드를 정리하고 형식을 지정하고 유효성을 검사합니다. 간단한 디자인을 원하고 빠른 솔루션을 원한다면 좋은 선택이 될 수 있습니다. 더러운 마크 업 오류 메시지 및 알림을 실시간으로 표시합니다. 너는 편집기 내부에서 코드 작성 또는 수정.
당신이 “깨끗한” 버튼, 그것 한 번에 구문 오류를 수정하여 형식을 정리하지만 경고는 그대로 남깁니다. 하지만 당신이 원하는대로 풀 수있게 해줍니다. 테스트 할 규칙은 선택할 수 없지만 세 가지 파일 형식 모두 형식을 결정할 수있는 몇 가지 설정이 있습니다. 청소 된 출력의.
6. JSLint
JSLint는 2002 년 Douglas Crockford에 의해 처음 출시되었으며, 그 이후로 추진력을 잃지 않았으므로 안정적이고 안정적인 JavaScript linting 도구라고 가정 할 수 있습니다.
JSLint는 JavaScript 소스 코드와 JSON 텍스트를 처리 할 수 있으며 JS 모범 사례를 따르는 기성 구성 Crockford는 그의 책 "JavaScript : The Good Parts"에 대해 썼습니다..
JSLint에는 선택할 수있는 몇 가지 옵션이 있지만 나만의 맞춤 규칙을 추가하거나 대부분의 기능을 사용 중지 할 수 없습니다.. JSLint에는 이미 최신 ECMAScript 6 표준이 포함되기 시작했습니다. 여기서는 ES6 구현의 현재 단계를 확인할 수 있습니다..
7. JSHint
JSHint는 JSLint의 매우 인기있는 포크이며 Facebook, Twitter 및 Medium과 같은 주요 기술 회사에서 사용합니다.
JSHint는 다음과 같은 작업을 시작한 커뮤니티 주도 프로젝트입니다. JSLint의 구성 가능하고 덜 독창적 인 버전을 만듭니다.. JSHint를 사용하면 개발자가 linting 옵션을 구성하고 사용자 정의 된 구성을 별도의 파일, 도구를 쉽게 재사용 할 수있는 옵션, 더 큰 프로젝트에 적합하게 배치 할 수 있습니다.
JSHint를 사용하여 바닐라 자바 스크립트를 보완 할 수있을뿐 아니라 jQuery, Mootools, Mocha 및 Node.js와 같이 많이 사용되는 JS 라이브러리를 즉시 사용할 수 있습니다..
8. ESLint
ESLint는 JavaScript linting 환경에서 가장 최신의 것입니다. 그것의 인기는 그것의 높게 가동 가능한 성격에서 유래한다. 세련된 linting 규칙을 수 많은 사용자 정의하고 모든 주요 코드 편집기와 통합 할 수있을뿐 아니라, 기능 확장 다른 플러그인을 추가하여.
파서 옵션을 지정하면 지원할 JS 언어의 표준 선택 linting 프로세스 중에는 기본 ECMAScript 5 구문과 비교하여 스크립트를 확인할 수있을뿐 아니라 ECMAScript 6, ECMAScript 7 및 JSX에 대해서도 스크립트를 확인할 수 있습니다..
9. JSCS
JSCS 또는 JavaScript 코드 스타일은 코드 형식 규칙을 확인하는 JavaScript 용 플러그 가능 코드 스타일 링터입니다..
JSCS의 목표는 다음과 같은 수단을 제공하는 것입니다. 특정 코딩 스타일 지침을 준수하도록 프로그래밍 방식으로 시행. JSCS는 버그와 오류를 확인하지 않지만 개발자가 높은 가독성과 일관성을 갖춘 코드 기반을 유지할 수 있도록 Google, AirBnB, AngularJS와 같이 기술 업계의 많은 주요 업체에서 사용하고 있습니다..
JSCS는 서식 오류를 자동으로 수정하므로 하나씩 처리 할 필요가 없으므로 실시간 보호기입니다. 여기에는 Google, Grunt 또는 Wikimedia 코딩 스타일 사전 설정과 같이 더 큰 프로젝트에 속한 여러 가지 다양한 사전 설정이 있으므로 자신의 프로젝트에서 쉽게 사용할 수 있지만 나만의 맞춤 구성을 만들 수도 있습니다..
10. StandardJS
StandardJS 또는 JavaScript 표준 스타일은 JSCS와 마찬가지로 코드 스타일의 linter이지만 단순하고 간단합니다. StandardJS는 훌륭한 선택이 될 수 있습니다., 구성과 시간을 보내고 싶지 않은 경우, 상자에서 곧바로 실행되는 효과적인 도구가 필요합니다..
StandardJS는 사전 작성된 서식 규칙을 몇 가지 따르며 핵심 가치는 코딩 워크 플로를 산만하게 유지하여 동의하지 않는 규칙을 변경할 수 없도록하는 것입니다. 커스텀 설정을 원하지 않고 단지 원하는 경우 StandardJS 만 선택하십시오. 자바 스크립트 파일 전체에 일관된 코드 스타일 적용.
