CSS·JavaScript 서식

소스 코드를 실행하지 않고 서식을 정리하거나 축소합니다. 원본을 보관하고 내보낸 코드를 사용 전에 테스트하세요.

처리는 기기에서 수행됩니다. 활성화된 Google 서비스가 페이지·입력에 접근할 수 있으므로 기존 개인정보 설정을 사용하세요.

작동 원리

Prettier는 JavaScript·CSS 서식을 정리합니다. Terser는 compression·식별자 축약을 끈 채 JavaScript를 축소하며 some 주석 정책은 일반 주석을 지울 수 있습니다. CSSO는 구조 재편 없이 CSS를 축소합니다.

서식은 공백·구두점을 바꿉니다. 축소는 정화가 아니므로 위험한 코드가 남을 수 있습니다. 미리보기·실행·원격 가져오기·소스맵은 없습니다.

입력 최대 100,000 UTF-16단위, 가져오는 파일 100,000바이트, 출력 1,000,000단위입니다. 5,000ms Worker 타이머가 처리를 취소하지만 브라우저가 콜백을 지연할 수 있습니다.

파서 기반 변환이지 대상 환경에서의 정확성·호환성 증명은 아닙니다. HTML·JSON은 별도 도구를 사용하세요. 직접 편집하기 전에는 원본이 바뀌지 않으며 초기화하면 지워집니다.

Language: JavaScript
Operation: Format
const add=(a,b)=>{return a+b};

const add = (a, b) => {
  return a + b;
};

함수는 공백과 끝 줄바꿈을 포함한 여러 행으로 배치됩니다. 소스를 분석할 뿐 호출하지 않습니다.

Language: CSS
Operation: Format
.note{color:red;margin:0}

.note {
  color: red;
  margin: 0;
}

들여쓰기·줄바꿈으로 규칙의 선언 두 개를 읽기 쉽게 만듭니다.

Language: CSS
Operation: Minify
.note { color: red; margin: 0px 0px; }

.note{color:red;margin:0 0}

공백과 0의 단위를 제거합니다. 이 설정에서는 margin 값 두 개가 0 0으로 남습니다.

Language: JavaScript
Operation: Minify
function add(a, b) { return a + b; }

function add(a,b){return a+b}

식별자 축약과 압축을 껐으므로 함수 이름·매개변수는 유지되고 서식 공백은 제거됩니다.

Language: JavaScript
Operation: Format
const =

서식을 완료하지 못했습니다. 선택한 언어·문법을 확인하거나 새로고침 후 다시 시도하세요.

미완성 선언 const =는 유효한 JavaScript가 아닙니다. 문법을 수정하세요. 도구가 빠진 코드를 만들어 넣지는 않습니다.