프론트엔드 코딩 컨벤션 자동화 도구

프론트엔드 코딩 컨벤션 자동화 도구

프론트엔드 코딩 컨벤션 자동화 도구 from Taegon Kim

프론트엔드 코딩 컨벤션 자동화 도구

1. 'single quote' "double quote"

2. if ( str === 'true' ) { return true; } if ( str === 'true' )
 { return true; }

3. 


4. # 유닉스 형태의 줄 바꿈, 파일 끝 빈 줄 삽입, 줄 끝 공백 제거, 스페이스 4칸 [*] end_of_line = lf insert_final_newline = true trim_trailing_whitespace = true indent_style = space indent_size = 4 # 중괄호 표기를 사용해 여러 파일 확장자에 설정 적용, 기본 문자셋 [*.{js,py}] charset = utf-8 # lib 디렉토리 아래의 JS 파일엔 별도의 들여쓰기 설정 적용 [lib/**.js] indent_style = space indent_size = 2

5. 


6. 


7. { "rules": { "length-zero-no-unit": true } } 


8. /* style.css */ body { background: #fff; font-size: 1.2em; } $> stylefmt -c stylefmt.json style.css margin: 0em;

9. /* style.css */ body { background: #fff; font-size: 1.2em; } $> stylefmt -c stylefmt.json style.css margin: 0;

10. 


11. 
 {
 "scripts": {
 "prettier": "prettier —single-quote --write **/*.js"
 }
 }

12. func(arg1, arg2, arg3); func(aFunctionWhoHasALongName(), iAmSoLong

13. func(arg1, arg2, arg3); func(
 aFunctionWhoHasALongName(),
 iAmSoLongToo(),
 weNeedLineBreaks()
 );

14. 세미콜론? 객체 표기 끝의 쉼표? 탭? 스페이스? 잊어버리세요. Prettier가 있습니다.

15. 
 {
 "scripts": {
 "precommit": "lint-staged",
 "prepush": "npm test",
 "...": "..."
 },
 "lint-staged": {
 "*.js": [
 "prettier —-write",
 "git add"
 ]
 }
 }

16. 감사합니다