사용 방법
- 코드를 붙여넣거나 "예시 불러오기"를 클릭해 사용해 보세요.
- JavaScript, TypeScript, JSON 중에서 고르고 들여쓰기, 줄 너비, 세미콜론, 따옴표 스타일을 설정하세요.
- "포맷"을 클릭하거나 Ctrl+Enter(Mac은 ⌘+Enter)를 누르세요.
- 정리된 코드를 복사하세요.
옵션 설명
- 들여쓰기
- 공백 2칸이 Prettier 기본값이자 JavaScript 프로젝트에서 가장 흔한 스타일이에요. 탭을 고르면 탭 문자로 들여써요.
- 줄 너비
- 이 글자 수를 넘어가는 표현식은 Prettier가 줄을 바꿔요. 기본값은 80이에요.
- 세미콜론
- 끄면 문장 끝의 세미콜론을 생략해요. 생략하면 의미가 달라지는 곳에는 Prettier가 여전히 세미콜론을 넣어요.
- 작은따옴표
- 문자열에 "큰따옴표" 대신 '작은따옴표'를 써요. 단, 그러면 이스케이프가 더 많이 필요한 경우는 예외예요.
예시
압축된 번들. 한 줄로 압축된 코드를 붙여넣으면 무슨 일을 하는지 읽을 수 있어요. 들여쓰기와 줄바꿈은 복원되지만, 짧아진 변수 이름은 그대로 남아요.
팀 스타일. 공백 4칸 들여쓰기, 세미콜론 없음, 작은따옴표처럼 프로젝트의 Prettier 설정에 맞추세요.
자주 묻는 질문
JSX와 최신 문법도 되나요?
네. JavaScript 모드는 Babel 파서를 사용해서 JSX, 옵셔널 체이닝, 클래스 필드, 최상위 await 등 최신 문법을 이해해요.
구문 오류가 있다고 나오는 이유는 뭔가요?
Prettier는 코드를 파싱한 다음에 포맷하기 때문에, 올바른 JavaScript가 아닌 코드에서는 멈춰요. 메시지에 확인할 행과 열이 표시돼요.
정리된 코드도 똑같이 동작하나요?
네. Prettier는 공백, 줄바꿈, 따옴표, 괄호, 세미콜론만 코드의 의미가 유지되는 방식으로 바꿔요.
코드가 업로드되나요?
아니요. Prettier가 브라우저에서 실행되므로 코드는 기기 밖으로 나가지 않아요.
개인정보 보호
이 도구는 전적으로 브라우저에서 실행돼요. 파일과 텍스트는 기기에서 처리되며 서버로 업로드되지 않아요.