이 도구에 대해
코드는 번들에서 압축된 채로 오기도 하고, 빠르게 붙여넣어 지저분하기도 하며, 당신은 그 반대가 필요합니다. 이 포매터는 둘 다 합니다: HTML, CSS, JavaScript를 펼치고 들여써서 읽기 쉽게 만드는 정렬, 또는 배포를 위해 줄이는 압축입니다. JavaScript 압축은 Terser, CSS는 CSSO가 담당합니다 — 실제 빌드 파이프라인에서 검증된 바로 그 도구들입니다.
모든 것이 브라우저에서 로컬로 실행되므로 독점 코드도 사용자 컴퓨터에 남습니다. 언어를 고르고 정렬 또는 압축을 선택한 뒤 결과를 복사하세요.
자주 묻는 질문
코드 정리(beautify)와 압축(minify)의 차이는 무엇인가요?
정리는 들여쓰기와 줄바꿈을 추가해 코드를 읽기 쉽게 만들고, 압축은 공백과 주석을 제거하고 이름을 줄여 배포용 파일 크기를 최소화합니다. 개발 중에는 정리를, 배포 전에는 압축을 사용하세요.
압축하면 코드 동작이 바뀌나요?
그렇지 않아야 합니다 — 압축 도구는 의미상 동일하다고 증명 가능한 문법만 재작성합니다(지역 변수 이름 변경, 죽은 코드 제거 등). 압축된 결과물이 다르게 동작한다면, 대개 공백에 민감한 방식에 의존한 코드였거나 압축기의 파서가 실제 버그를 발견한 경우입니다.
제 코드가 어딘가로 업로드되나요?
아닙니다. 포맷팅과 압축 모두 한 번 로드되어 로컬에서 실행되는 JavaScript 라이브러리(js-beautify, Terser, csso)를 사용해 브라우저 안에서만 실행됩니다. 코드는 이 페이지를 벗어나지 않습니다.
이 포맷터는 어떤 언어를 지원하나요?
JavaScript, CSS, HTML을 지원합니다. JS 압축은 Terser, CSS 압축은 csso를 사용하며, HTML 압축은 <pre>, <script>, <style> 태그 내용을 보존하는 경량 자체 로직입니다.
정리된 결과 대신 구문 오류가 나온 이유는 무엇인가요?
포맷터는 정리나 압축을 하기 전에 코드를 먼저 파싱합니다. 따라서 실제 구문 오류(짝이 맞지 않는 중괄호, 불필요한 쉼표 등)가 있으면 줄 번호와 함께 오류를 알려주며, 깨진 결과를 조용히 만들어내지 않습니다.