작업 흐름 간소화: miniwebtool 검색.
추가
함께 보기
Less to CSS 컴파일러SCSS CSS 컴파일러SVG React JSX 변환기JavaScript가 활성화되어 있습니까?ppm에서 퍼센트 변환기
홈페이지 > 웹 관리 도구 > TypeScript 플레이그라운드
 

TypeScript 플레이그라운드

브라우저에서 직접 TypeScript를 작성, 컴파일, 타입 검사 및 실행하세요. 실시간 진단 기능, JavaScript 출력, 엄격 모드(Strict Mode) 제어, 빠른 예제 및 샌드박스 콘솔을 제공합니다.

TypeScript 플레이그라운드
브라우저 컴파일러 콕핏
TypeScript 컴파일러 로드 중
빠른 예제:
TS playground.ts 컴파일러 대기 중
0줄
컴파일러 옵션
컴파일 파이프라인
TS
소스 (Source)
TypeScript 텍스트 파싱
타입 (Types)
계약 및 추론 검사
JS
출력 (Emit)
JavaScript 결과물 생성
실행 (Run)
샌드박스 콘솔 전용
ℹ 컴파일은 브라우저 내에서 안전하게 진행됩니다. 내장된 컴팩트 타입 라이브러리는 간단한 스니펫에 유용하며, 프로젝트별 패키지 타입은 로컬 TypeScript 설정을 사용해야 합니다.

Embed TypeScript 플레이그라운드 Widget

컴파일러 출력
TypeScript 대기 중
타입 상태
대기 중
진단
0
출력 크기
0 B
컴파일 시간
0 ms
컴파일러를 로드하는 중입니다. 첫 번째 컴파일 후 진단이 여기에 표시됩니다.
샌드박스 실행 출력
컴파일된 JavaScript 를 실행하면 콘솔 출력이 여기에 표시됩니다.
'; updateStage('run', false); runnerEl.srcdoc = sandboxHtml; } function downloadJavaScript() { const blob = new Blob([jsOutputEl.value], { type: 'text/javascript;charset=utf-8' }); const url = URL.createObjectURL(blob); const link = document.createElement('a'); link.href = url; link.download = 'playground.js'; document.body.appendChild(link); link.click(); document.body.removeChild(link); URL.revokeObjectURL(url); } function tidyIndents() { const tidied = sourceEl.value .replace(/\t/g, ' ') .split('\n') .map(function (line) { return line.replace(/\s+$/g, ''); }) .join('\n') .replace(/\n{4,}/g, '\n\n\n'); sourceEl.value = tidied; compileNow(); } function resetSource() { sourceEl.value = document.getElementById('tsplay-source').defaultValue; compileNow(); } sourceEl.addEventListener('input', scheduleCompile); sourceEl.addEventListener('scroll', function () { linesEl.scrollTop = sourceEl.scrollTop; }); sourceEl.addEventListener('keydown', function (event) { if (event.key === 'Tab') { event.preventDefault(); const start = sourceEl.selectionStart; const end = sourceEl.selectionEnd; sourceEl.value = sourceEl.value.slice(0, start) + ' ' + sourceEl.value.slice(end); sourceEl.selectionStart = sourceEl.selectionEnd = start + 2; scheduleCompile(); } }); document.querySelectorAll('[data-example]').forEach(function (button) { button.addEventListener('click', function () { const name = button.getAttribute('data-example'); if (EXAMPLES[name]) { sourceEl.value = EXAMPLES[name]; compileNow(); } }); }); document.querySelectorAll('.tsplay-result .tsplay-tab').forEach(function (tab) { tab.addEventListener('click', function () { setActiveTab(tab.getAttribute('data-tab')); }); }); [targetEl, moduleEl, strictEl, indexedEl, declarationsEl].forEach(function (control) { control.addEventListener('change', compileNow); }); compileBtn.addEventListener('click', compileNow); runBtn.addEventListener('click', runJavaScript); document.getElementById('tsplay-copy-source').addEventListener('click', function () { copyText(sourceEl.value, 'TypeScript'); }); document.getElementById('tsplay-copy-js').addEventListener('click', function () { copyText(jsOutputEl.value, 'JavaScript'); }); document.getElementById('tsplay-download-js').addEventListener('click', downloadJavaScript); document.getElementById('tsplay-format-btn').addEventListener('click', tidyIndents); document.getElementById('tsplay-clear-console').addEventListener('click', function () { consoleEl.textContent = '컴파일된 JavaScript 를 실행하면 콘솔 출력이 여기에 표시됩니다.'; }); document.getElementById('tsplay-clear-btn').addEventListener('click', resetSource); window.addEventListener('message', function (event) { if (!event.data || event.data.tsplayToken !== runnerToken) { return; } addConsoleLine(event.data.kind, event.data.value); }); function waitForCompiler(attempt) { syncEditorStats(); if (window.ts) { compilerStateEl.textContent = 'TypeScript ' + window.ts.version + ' 준비 완료'; setStatus('ready', '컴파일러 준비 완료'); compileNow(); return; } if (attempt > 80) { compilerStateEl.textContent = '컴파일러를 사용할 수 없음'; setStatus('error', '컴파일러를 사용할 수 없음'); diagnosticsEl.innerHTML = '
TypeScript 컴파일러를 로드할 수 없습니다
네트워크 연결 또는 콘텐츠 차단기를 확인한 후 페이지를 다시 로드하세요.
'; return; } setTimeout(function () { waitForCompiler(attempt + 1); }, 150); } waitForCompiler(0); })();
📲

MiniWebtool 앱 설치

홈 화면에 추가하여 즉시 접근 — 무료, 빠름, 다운로드 불필요.

           

더 빠르고 광고 없이 원하나요?

TypeScript 플레이그라운드 정보

이 TypeScript Playground 를 사용하면 전체 프로젝트를 열지 않고도 스니펫을 빠르게 테스트할 수 있습니다. 브라우저에서 TypeScript 컴파일러를 실행하고, 줄 번호와 함께 타입 검사 진단을 표시하며, JavaScript 를 출력하고, 간단한 출력을 샌드박스화된 콘솔에서 실행할 수 있습니다.

이 TypeScript Playground 의 기능

이 도구는 일상적인 TypeScript 검사를 위해 설계되었습니다. union 좁히기 검증, 제네릭 헬퍼 타입 테스트, 컴파일러 타겟 비교, strict 모드 동작 확인, TypeScript 가 출력하는 JavaScript 검토에 사용됩니다. 학습, 작은 예제 디버깅, 답변 준비, 프로젝트로 옮기기 전 작은 리팩터링 확인에 유용합니다.

TypeScript 컴파일러 사용 방법

  1. 에디터에 TypeScript 를 붙여넣거나 빠른 예제를 선택하세요.
  2. JavaScript 타겟과 모듈 형식을 선택하세요.
  3. 더 엄격한 진단을 원할 때는 strict 모드와 선택적 인덱스 액세스 검사를 활성화하세요.
  4. 컴파일 및 타입 검사를 클릭하거나, 실시간 피드백을 위해 자동 컴파일을 활성화 상태로 두세요.
  5. 진단을 검토하고, 출력된 JavaScript 를 확인한 후, 샌드박스화된 콘솔에서 간단한 스니펫을 실행하세요.

타입 검사 참고 사항

브라우저 컴파일러는 배열, 문자열, 레코드, JSON, console, 타이머와 같은 일반적인 JavaScript 객체에 대해 간결한 내장 선언 파일을 사용합니다. 덕분에 playground 는 스니펫에 대해 빠르고 자체 완결적으로 유지됩니다. 코드가 React, Node.js, DOM API 또는 패키지 특정 선언에 의존하는 경우, 실제 tsconfig.json 및 설치된 타입 패키지를 사용하여 프로젝트 내에서 최종 결과를 확인하세요.

예제와 사용 사례

큰 코드베이스에서 타입 오류를 분리하거나, strict 모드가 진단을 어떻게 변경하는지 비교하거나, 동료에게 TypeScript 개념을 설명하거나, 작은 스니펫이 JavaScript 로 어떻게 컴파일되는지 확인하려는 경우 이 playground 를 사용하세요. 내장된 예제는 구별된 유니온, 제네릭 레코드 헬퍼, satisfies 연산자 및 의도적인 타입 실수를 다루므로 깔끔한 컴파일러 상태와 실패한 컴파일러 상태를 모두 확인할 수 있습니다.

  • API 응답 모델에 추가하기 전에 union 타입을 검증하세요.
  • 전체 애플리케이션 빌드를 기다리지 않고 제네릭 헬퍼를 테스트하세요.
  • 타겟 또는 모듈 옵션을 변경할 때 출력된 JavaScript 를 검사하세요.
  • TypeScript 진단의 간결한 재현을 공유하세요.
프로덕션 빌드의 경우 이 페이지를 빠른 진단 작업 공간으로 사용한 후, 배포하기 전에 프로젝트 컴파일러, 번들러, 린터, 테스트 및 프레임워크 빌드를 실행하세요.

자주 묻는 질문

이 도구가 TypeScript 타입을 검사합니까?

예. 브라우저 내 TypeScript 프로그램을 빌드하고 타입 오류, 구문 오류 및 컴파일러 옵션 메시지를 포함한 컴파일러의 진단을 보고합니다.

TypeScript 컴파일러 옵션을 변경할 수 있습니까?

예. 주요 컨트롤은 JavaScript 타겟, 모듈 출력, strict 모드, 선언 파일 출력 및 noUncheckedIndexedAccess 를 다룹니다.

라이브러리 타입이 누락된 이유는 무엇입니까?

이 playground 는 의도적으로 간결한 내장 타입 라이브러리를 사용합니다. 프레임워크, DOM, Node.js 또는 npm 패키지 타입의 경우 로컬 프로젝트 설정을 사용하세요.

JavaScript 실행기는 안전합니까?

실행기는 빠른 스니펫을 위해 샌드박스화된 iframe 을 사용합니다. 신뢰할 수 없는 코드 실행은 피하고, 실제 앱 코드는 일반적인 개발 환경 내에서 테스트하세요.

이 콘텐츠, 페이지 또는 도구를 다음과 같이 인용하세요:

"TypeScript 플레이그라운드" - https://MiniWebtool.com/ko/typescript-플레이그라운드/에서 MiniWebtool 인용, https://MiniWebtool.com/

by miniwebtool team. Updated: 2026-05-23

웹 관리 도구:

주요 도구:

인스타그램 사용자 ID 조회분수 계산기애너그램 생성기내 행운의 숫자는?복리 계산기방어율 계산기OPS 계산기무작위 초능력 생성기피트 인치 센티미터 변환기상대 표준 편차 계산기러닝 페이스 계산기16진수에서 10진수로 변환기주사위 굴리기시험관 출산 예정일 계산기소인수분해 계산기랜덤 이름 생성기근무 시간 계산기kg에서 파운드로 변환기야구 배팅 계산기🎮 게임 감도 변환기WAR 계산기파운드→킬로그램 변환기평균 계산기16진수 변환기cm에서 피트와 인치로 변환기공백 제거긴 나눗셈 계산기토크 변환기 (Nm, ft-lb, kgf-cm)로마 숫자 변환기10진수를 16진수로 변환이미지 분할기줄 바꿈 제거월경주기 계산기무작위 토너먼트 대진표 생성기벤치 프레스 계산기CAGR 계산기수면 계산기💧 이슬점 계산기랜덤 영어 단어 생성기바코드 생성기무작위 문자열 생성기기울기 및 경사 계산기🌬️ 체감 온도 계산기기대 수명 계산기사랑 궁합 계산기최대 공약수 계산기랜덤 생일 생성기👙 브라 사이즈 계산기태양, 달 & 상승궁 계산기 🌞🌙✨금리 계산기mAh to Wh 변환기명언 검색기 (영어)ppm에서 퍼센트 변환기YouTube 채널 통계키 백분위수 계산기주차 계산기분수 백분율 변환기무작위 날짜 생성기FIP 계산기원형 면적 계산기무작위 포커 핸드 생성기분수에서 소수로 계산기퍼센트 감소 계산기연비 계산기FPS 변환기📅 날짜 계산기야구 장타율 계산기초과 근무 수당 계산기자동차 대출 계산기Watts to Amps Calculator소수 검사기연봉 인상 계산기이닝당 적중률(WHIP) 계산기피타고라스 정리 계산기어린이 BMI 백분위수 계산기⏱️ 시간 계산기속도 변환기반지 사이즈 변환기암페어에서 와트 계산기kVA 계산기HEX 계산기잘고 텍스트 생성기랜덤 동물 생성기일할 계산 월세 계산기확률 계산기비디오 이미지 추출기시저 암호 도구영업 마진 계산기헌혈 시간 계산기변화율 계산기임신 날짜 계산기비율 및 백분율 계산기혈당 변환기임신 체중 증가 계산기랜덤 그룹 생성기볼링 점수 계산기암호화폐 레버리지 계산기PSI에서 bar로 변환기요일 계산기타원 둘레 계산기3상 전력 계산기태양 위치 계산기연중 일수 계산기 - 오늘은 올해의 몇 번째 날인가요랜덤 식사 생성기예쁜 글씨 생성기이름 번호 계산기작은 텍스트 생성기 ⁽ᶜᵒᵖʸ ⁿ ᵖᵃˢᵗᵉ⁾타이어 크기 계산기퍼센트에서 PPM으로 변환기MAC 주소 생성기자동차 감가상각 계산기백분율 성장 계산기MAC 주소 조회몫과 나머지 계산기ANC 계산기영업일 계산기즉시 연금 계산기섭씨-화씨 온도 변환기백분율 할인 계산기인치에서 센티미터으로 변환기호 길이 계산기TDEE 계산기페이스북 사용자 ID 조회모스 부호 생성기급여 변환 계산기랜덤 미국 주 생성기임대 수익률 계산기동영상 병합콜라츠 추측 계산기중복 줄 제거GFR 계산기두 날짜 사이 일수 계산기단어 찾기 퍼즐 생성기백분율 증가 계산기진법 변환기최소공배수 계산기랜덤 토론 주제 생성기무작위 플레이 카드 생성기반올림 계산기십진수에서 이진수로 변환기HEX에서 CMYK로 변환기빈 줄 제거간헐적 단식 계산기음력 양력 변환기최대 심박수 계산기거꾸로 텍스트 생성기칵테일 ABV 계산기계단 계산기목표 심박수 계산기공학용 계산기배당 수익률 계산기취소선 텍스트 생성기랜덤 물품 생성기16진수에서 이진법 변환기온라인 문장 부호 제거 도구반전 텍스트착상 계산기🎰 가챠 천장 계산기적분 계산기중국식 성별 예측기HTML에서 텍스트 변환기손절 및 익절 계산기오디오 추출기원형 계산기정기 예금 계산기마틴게일 전략 계산기센티미터에서 인치로 변환기달력출석률 계산기형량 감경 계산기번호 정렬영업 이익률 계산기이진수를 십진수로 변환초승달과 보름달 달력걸음 수 거리 계산기임대료 인상 계산기화씨에서 섭씨로 계산기속도 계산기출루율 계산기켈리 기준 계산기무작위 라인볼트 토크 계산기자녀 키 예측기배당금 재투자 계산기kPa에서 psi로 변환기신발 사이즈 변환기크레아티닌 청소율 계산기YouTube 댓글 추첨기YouTube 쇼츠 수익화 계산기가위바위보 생성기빗변 계산기아크탄젠트 계산기Z 점수 계산기중앙값 계산기1RM (1회 최대 반복) 계산기나의 띠는 무엇인가요?출산 예정일 계산기면적 계산기숫자를 단어로 변환기16진수에서 RGB로의 변환기PDF 보호PDF에 페이지 번호 추가PDF 페이지 순서 변경PDF 페이지 삭제PDF 회전JPG를 PDF로 변환PDF를 JPG로 변환PDF 압축PDF 분할PDF 병합PT에서 PX로 변환기PX에서 REM 변환기톨라에서 그램 변환기인도 토지 단위 변환기mcg에서 mg로 변환기AI 노래 가사 생성기AI 시 생성기AI 스토리 생성기AI 번역기AI 텍스트 요약기mg에서 mL 변환기MPH에서 KMH 변환기노트-마일 변환기세제곱미터에서 세제곱피트세제곱피트에서 세제곱야드 변환기제곱피트에서 제곱미터 변환기제곱미터에서 제곱피트 변환기온스를 mL로 변환기mL를 온스로 변환기갤런에서 리터 변환기리터에서 갤런 변환기킬로그램 스톤 변환기스톤 킬로그램 변환기인치에서 밀리미터로 변환기밀리미터에서 인치로 변환기마일 킬로미터 변환기킬로미터-마일 변환기화씨-섭씨 변환기섭씨 화씨 변환기배낭 크기 계산기서핑보드 부피 계산기테니스 그립 사이즈 계산기헬멧 사이즈 계산기장갑 사이즈 계산기모자 사이즈 변환기스노보드 사이즈 계산기스키 사이즈 계산기자전거 사이즈 계산기스피드런 스플릿 타이머스테이블포드 계산기다트 체크아웃 계산기볼링 이코노미 계산기타격 스트라이크 레이트 계산기네트 런 레이트 계산기K/D 비율 계산기Elo 레이팅 계산기심박수 회복 계산기하이킹 시간 계산기로잉 페이스 계산기달리기 연령 등급 계산기FTP 및 파워 존 계산기Beep 테스트 계산기ACFT 점수 계산기Wilks & DOTS 계산기휠 오프셋 계산기타이어 하중 지수 및 속도 등급 조회마일당 비용 계산기리스 바이아웃 계산기옥탄가 혼합 계산기2행정 오일 혼합 계산기엔진 배기량 계산기소파 문 통과 계산기장작 코드 계산기공기청정기 CADR 계산기제습기 크기 계산기천장 선풍기 크기 계산기커튼 크기 계산기러그 크기 계산기그림 거는 높이 계산기TV 설치 높이 계산기TV 크기 계산기연못 용적 및 라이너 계산기수영장 소금 계산기수영장 부피 계산기온수기 크기 계산기에폭시 레진 계산기난간동자 간격 계산기걸레받이 및 트림 계산기사이딩 계산기데크 스테인 계산기잔디 씨앗 계산기잔디 계산기아스팔트 계산기세제곱야드 계산기안테나 길이 계산기전선관 충전율 계산기직렬/병렬 커패시터 계산기유도 리액턴스 계산기방 조명 계산기럭스 루멘 계산기루멘 와트 변환기발전기 크기 계산기직렬 저항 계산기마찰 계산기경사면 계산기기계적 이득 계산기음속 계산기파동 속도 계산기부력 계산기종단 속도 계산기드브로이 파장 계산기광자 에너지 계산기E=mc² 계산기시간 지연 계산기케플러 제3법칙 계산기탈출 속도 계산기만유인력 계산기비어 람베르트 법칙 계산기네른스트 방정식 계산기삼투압 계산기끓는점 오름 계산기어는점 내림 계산기백분율 조성 계산기노르말 농도 계산기몰랄농도 계산기pKa Ka 변환기헨더슨 하셀바흐 계산기이론 수율 계산기한계 반응물 계산기전자 배치 계산기인터랙티브 주기율표AI 수업 지도안 생성기AI 퀴즈 생성기인용 생성기 (APA/MLA/Chicago)AP 점수 계산기ACT 점수 계산기SAT 점수 계산기백분율 CGPA 변환기CGPA 백분율 변환기쉬운 채점기 (EZ Grader)자녀 양육비 계산기아기 우유 섭취량 계산기기저귀 사이즈 계산기아기 이름 생성기아기 눈 색깔 예측기hCG 배가 시간 계산기ISO 8601 날짜 포맷터율리우스일 변환기낮잠 계산기Moon Phase CalculatorSunrise & Sunset Calculator세계 시계날짜 로마 숫자 변환기은퇴 카운트다운금주 계산기반 생일 계산기기념일 계산기팁 분배 계산기이메일 마케팅 ROI 계산기리드당 비용 계산기운전자본 계산기유튜브 수익 추정기무작위 RPG 캐릭터 생성기
×

우리에게 호의를 베풀고 3개의 간단한 질문에 답하세요.

설문조사에 응해주셔서 감사합니다. 귀하의 의견은 서비스를 개선하는 데 도움이 됩니다.

어디에서 우리에 대해 처음 들었습니까?

우리 사이트에서 가장 좋아하는 도구는 무엇입니까?

다른 경우, 지정하십시오:

이 도구를 친구에게 추천할 가능성은 얼마나 됩니까?

불가능한가능성이 가장 높음

가능성 점수: (1-10)