@platform/vue-debugger어떤 Vue 3 앱에도 붙는 인페이지 디버거

브라우저 확장도, devtools도 없는 환경(사내 폐쇄망·모바일 WebView)을 위한 디버거를 다른 프로젝트에 이식하는 공식 가이드

11개 패널, 한 번의 설치

컴포넌트 인스펙션·네트워크·Pinia·Router·스토리지·콘솔·에러·연쇄·네이티브 브리지·리포트·정보. main.ts 몇 줄이면 끝납니다.

패널 레퍼런스

📱

WebView/모바일 브라우저엔 devtools가 없습니다. 터치 대응·세로 스택·전체화면·식 평가(콘솔 대체)로 폰에서도 디버깅합니다.

별도 Vue 인스턴스 + Shadow DOM으로 완전 격리. CSS import도 필요 없습니다. 닫혀 있으면 비용 0.

격리 보장

vue 하나만 peer 의존. 폐쇄망 반입은 tgz 파일 하나로 끝납니다. pinia/router/axios는 import 없이 런타임 발견.

폐쇄망 반입

활성 분기가 정적 false이면 동적 import가 통째 dead-code로 제거됩니다. 번들에 디버거 코드가 들어가지 않습니다.

보안·누출 차단

mode 명시 분기(예방) + npx vue-debugger-leak-check CI 게이트(증명) + attachDebugger 트립와이어(탐지). 금융권 보안 감사 반영.

보안·누출 차단

난독화 스택을 .map으로 되돌려 'src/…:라인'으로, 개발자 호출자를 최대 5스텝 강조. 끊긴 비동기 경계는 인과 맥락(breadcrumb)으로 보완합니다.

변경 이력

어느 코드가 어느 기준정보 키를 읽는지 런타임 역인덱스로. 암묵적 스토리지 의존성을 명시화합니다 — "이 키 지워도 되나"에 증거로 답하세요.

패널 레퍼런스