DevTools 팁: 스니펫 및 라이브 표현식

Sofia Emelianova
Sofia Emelianova
GitHub

DevTools의 스니펫을 사용하여 자주 사용하는 코드를 실행하고 실시간 표현식을 사용하여 JavaScript 값을 실시간으로 확인할 수 있습니다.

다음 방법에 대해 알아보려면 동영상을 시청하세요.

  • 스니펫을 만들거나 스니펫 창을 엽니다.

  • 새 스니펫을 실행합니다.

    • 소스에서 Command / Control + Enter 단축키 사용
    • 명령어 메뉴에서 !를 사용합니다.

  • 값을 스니펫에 전달합니다.

    1. 중단점을 사용하여 일시중지합니다.
    2. Sources > Scope 창에서 값을 설정합니다.
    3. 실행을 재개합니다.

  • 콘솔에서 스니펫 실행: 전역 함수로 로드하고 한 번 실행합니다.

  • 스니펫에 Console Utilities API를 사용합니다.

  • 콘솔 > Live Expressions를 사용합니다.

    • 반복적으로 실행하려는 코드 조각을 실행하려는 경우(예: 디버깅 세션 도중)
    • 실행 중에 값이 어떻게 변경되는지 실시간으로 확인합니다.

자세한 내용은 다음을 참고하세요.