Chrome DevTools에 표시된 jsx 코드에서 원시 ES5로 다시 전환하는 빠른 방법이 있습니까?
Chrome DevTools에서 소스 맵 비활성화
답변:
개발자 도구를 열고 개발자 도구의 "설정"으로 이동 한 다음 Enable JavaScript Sourcemaps"소스"설정에서 선택을 취소 합니다.
7
감사합니다. 이 옵션을 변경하면 적용되기 전에 새로 고침이 필요합니다. 새로 고침없이 옵션을 전환 할 수있는 방법이 있기를 바랐습니다.
—
Jack Allan
아니. 설정에 따라 소스를 재 해석해야하기 때문입니다.
—
가비
감사합니다. 항상 내부적으로 es5를 실행하고 소스 매핑이 소스 코드에서 현재 명령문이 어느 줄에 있는지 디버거에게 알려주기 때문에 이것이 왜 필요한지 궁금합니다.
—
Jack Allan
저처럼 이러한 설정을 찾는 데 어려움을 겪는 사람들은 다음을 참조하십시오. i.imgur.com/9aMlBfg.png
—
joshcomley
방금 시도했는데 즉각적인 효과가있는 것 같습니다. 즉, 페이지 새로 고침이 더 이상 필요하지 않은 것 같습니다.
—
Jackson
줄 번호를 두 번 클릭하여 소스 파일에서 축소되지 않은 출력 파일로 이동할 수 있습니다. 그 외에는 제한적으로 보입니다. 아래 주석을 참조하십시오.
나는 이것이 개발 중에 유용하다는 것을 알았습니다. webpack-dev-serverjs를 축소하지 않고 사용할 때 (또는 다른 도구) 소스 파일에서 줄 번호를 두 번 클릭하여 컴파일되었지만 축소되지 않은 출력 파일로 이동할 수 있습니다.
방금 우연히 발견 한 후 2016 년 12 월 21 일에이 댓글을 찾았습니다. https://bugs.chromium.org/p/chromium/issues/detail?id=532174#c7
줄 번호를 두 번 클릭하여 원본 파일로 이동할 수 있지만 축소 된 파일에 모든 줄 바꿈이 제거 된 경우에는 거의 쓸모가 없습니다.
단어 줄 바꿈을 사용하면 더 잘 작동합니다 https://bugs.chromium.org/p/chromium/issues/detail?id=167287
축소 된 파일의 섹션을 두 번 클릭하여 소스 매핑 된 파일로 이동하는 데 일부 지원이 있다고 생각하지만 늦게 퇴보 한 것 같습니다.
소스 맵이있는 축소 된 파일에서 축소 된 파일의 아무 곳이나 마우스 오른쪽 단추로 클릭 (또는 두 번 클릭)하면 정확한 파일, 행 및 열로 이동할 수 있어야합니다.
줄 번호를 두 번 클릭하면 중단 점이 추가 된 다음 제거됩니다. 내가 뭔가를 놓치고 있습니까?
—
emclain
Idk. 가끔씩 만하는 것 같습니다. 그리고 Chrome이 소스 맵을 좋아하는 경우에만. 다른 라인이나 다른 프로젝트를 시도해 볼 수는 있지만 더 나은 제안은 없습니다. Chrome은이를 더 잘 지원합니다.
—
Scotty Wagoner