Chrome 개발자 도구 : html 스크립트가 비어 있습니다 (소스에서) 디버깅 자습서


92

NetBeans 및 Google Chrome을 사용하여 C hrome 디버깅 자습서를 수행하고 있습니다. 확장을 포함한 모든 것이 올바르게 작동하는 것 같지만 섹션에 도달 Use the Debugger하면 중단 점을 삽입하는 html 코드를 볼 수 없습니다.

브라우저에서 팝업 검사를 선택하면 콘솔에서 열리고 아무것도 표시되지 않고 Elements는 이미지가 추가 된 popup.html을 표시합니다. Sources로 이동하면 popup.html 파일을 열 수 있지만 Line 1은 비어 있습니다. js 파일을 열면 js 파일이 있고 편집 할 수 있습니다 (중단 지점).

미안합니다-아마도 기본적인 것 같지만 이것에 대해 그다지 경험이 없습니다. 나는 모든 것을 새로 고침하고 새로 고침을 시도했습니다.

후속 location.reload(true)조치 : 콘솔 프롬프트에 들어가면 popup.html 파일이 소스로 표시됩니다! 왜? 몰라요.

나는 이것이 내가 걸 으면서 보낸 하루 종일 누군가를 구하기를 바랍니다.


5
location.reload (true)는 나를 위해 일했습니다.
WillB3

예,하지만 그러면 페이지가 다시로드되고 디버거를 열기 전에 페이지에서 가졌을 수있는 상호 작용이 손실됩니다.
Peter Brand

어디에서 "location.reload (참)"작성해야
sidhewsar

2
2019 년에도 여전히 문제에 직면 해 있습니다!
아미르 Rizwan

이는 2019 년 10 월 Chrome 최신 버전에서 발생하지만 location.reload (true) 트릭은 아무것도로드하지 않았습니다. 덧붙여서 소스 창에는 줄 번호 1 만 표시되고 다른 것은 표시되지 않습니다.
Howard Brown

답변:


53

이것은 Chromium DevTools 의 알려진 문제 로 보입니다 . 기본적으로 HTML 및 기타 스크립트가 아닌 콘텐츠는 DevTools가 열리기 전에 이미 플러시되었으며 다시 가져올 수있는 신뢰할 수있는 방법이 없습니다. DevTools로 페이지를 새로 고침하면 문제가 "수정"됩니다.


4
동의 함-문제가 있으며이 수정 사항이 오래되었거나 (이전 동일한 문제의 경우) 작동하지 않습니다.
Dan Nissenbaum 2015 년

3
나도 같은 문제가 있습니다. 페이지를 새로 고침해도 문제가 해결되지 않습니다.
MH

17
개발자 도구를 닫고 검사 요소 옵션을 사용하여 다시 열면 작동합니다. 그것은 나를 위해 작동합니다.
Vishal

7
2017 년 12 월에 계속 진행됩니다!
Peter Brand

7
버그가 여전히 존재합니다
Chris Rogers

52

제 경우에는 도움이 된 주문이

  1. 소스의 빈 탭 닫기
  2. 개발 도구 닫기
  3. 개발 도구 열기
  4. 소스에서 탭 열기 (여전히 비어 있음)
  5. 페이지 새로 고침

1
이것이 신뢰할 수있는 해결책이 될지 누가 알겠지만 이번에는 효과가있었습니다! 😁
James Hill

1
야, 나는이 "수정"을 위해 영원히 찾고 있었다
Jordec

그것은 나를 위해 일했습니다
Smith

1
I. 할 수 없습니다. 믿다. 그것은 ... 년. 의. 고통 ... 해결되었습니다. 에. An. 즉시. 감사합니다.
egmfrs

1
나에게도 녹색으로 표시된 대답! 감사합니다
Richard

24

이 문제가 있었는데 Inspector 설정 창 (F1)에서 "Enable Javascript Source Maps"를 비활성화하면 문제가 해결되었음을 알았습니다.

내 js.map을 다시 만들고 설정을 다시 활성화했으며 소스를 계속 사용할 수 있습니다.

그래서 내 문제는 내가 최소화되지 않은 js (dev settings)를 제공하고 있었지만 맵 (프로덕션 설정 용으로 제작 됨)은 여전히 ​​거기에 있고 구식이라고 생각합니다.


4
크롬을 닫고 설정을 변경 한 후 다시여십시오!
Nateous

17

제 경우에는 탭에도 빈 페이지가 표시되어 콘솔에 액세스 할 수 없었습니다. 내 해결책은 빈 디버거 화면에 초점을 맞춘 CTRL + SHIFT + I 조합을 사용한 다음 parent.location.reload(true)팝업 디버거의 콘솔에 입력 하는 것입니다.


2
위의 WillB의 주석에서와 같이 페이지를 다시로드하고 디버거를 열기 전에 페이지에서 가졌을 수있는 상호 작용을 잃습니다.
Peter Brand

대박! 이것은 2 시간의 투쟁 후에 나를 위해 일했습니다.
Zeeshan Adil

parent.location.reload가 의미하는 바를 모르지만 크롬을 여러 번 다시 시작 / 하드 새로 고침 / 크롬 캐시 데이터 비우기 후 내 문제를 해결했습니다! 감사!
beluga

도와 드릴 수있어서 기쁩니다. 자식 창에서 부모 창 (CTRL + SHIFT + I를 입력 한 빈 창)을 다시로드합니다.
Ikenna Anthony Okafor

5

제 경우에는 디버거가 디버거의 "도메인 없음"섹션 아래에 빈 인덱스 페이지를 제공하도록하는 크롬 확장이있었습니다. 크롬에서 필수가 아닌 모든 확장을 비활성화 한 후 디버거는 올바른 소스를 다시 표시했습니다.


4
문제를 일으키는 확장을 메모했다면 좋았을 것입니다. 많은 확장 기능은 귀하에게 필수적이지 않고 저에게 필수적 일 수 있습니다. 이것은 대답을 쓸모 없게 만듭니다.
Imad

5
나는 "가치없는"에 동의하지 않을 것입니다. 적어도 당신은 플러그인을 확인하는 것을 알고 있습니다.
Brett Drake

이것이 제 문제였습니다. 제 경우에는 UltraSurf Unblock VPN 확장 프로그램을 설치했습니다. 시크릿 창에서 로컬 디버그 페이지를 열면 즉시 표시됩니다. ! 내가 하하 :( 인정해야 "durrrr"순간의 비트
IfElseTryCatch

시크릿을 사용하면 문제가 해결되었습니다.
Petah '

4

Dev Tools (F12)-> Inspector 설정 창 (F1)-> 기본값 복원 및 다시로드 [하단의 버튼]이 작동합니다!


2

나는 심각한 자바 스크립트 문제가 이와 같은 문제를 일으키는 것으로 나타났습니다. 제 경우에는 오타로 인해 전체 문서를 잘못 덮어 썼습니다.

Chromium WebTools 디버거에 빈 html 페이지가 표시되는 경우 자바 스크립트를 잘 살펴보고 이상한 일이 없는지 확인하세요.


1
이것이 나에게도 문제를 일으킨 것 같습니다. 제 경우에는 잘못된 jquery 참조가 있습니다. $ ( '# inputid')와 반대로 $ ( 'inputid').
Vincent

2

명령 줄 인수 "--user-data-dir"과 함께 새로운 세션을 사용하고 "Javascript 소스 맵 활성화"를 비활성화하여 문제를 해결했습니다. 내 코드는 Firefox 디버거에서 잘 표시되므로 Chrome 버그로 인한 것 같습니다.


1

나는 같은 문제가 있었다. 페이지 새로 고침도 작동하지 않았습니다.

진행 chrome://help 나를 위해 일한 브라우저 + 다시 시작 새로 고침.

메뉴를 통해 Chrome을 업데이트 할 수도 있습니다.

여기에 이미지 설명 입력


0

제 경우에는 멀웨어에 감염되고 브라우저를 재설정 한 후 갑자기 발생했습니다 (캐시 / 앱 데이터 삭제).

해결책 : 제 경우에는 Js에 영향을 미칠 수있는 확장 프로그램 제거

아래 확장 프로그램을 제거 / 비활성화하고 https://chrome.google.com/webstore/detail/quick-javascript-switcher/geddoclleiomckbhadiaipdggiiccfje?hl=ko

이상하게도 그 애드온을 문제없이 씻기 전에 CPR이 마음에 든다고 생각하기 때문입니다. :)


0

제 경우에는 며칠 동안 browsersync가 실행되면서 꿀꺽 꿀꺽 거리는 소리가났습니다. 나는 꿀꺽 꿀꺽 마시고 내 문제를 해결했습니다.


0

거대한 자바 스크립트 파일이있을 때도이 문제가 발생했습니다.

                points.push({
                    location: new google.maps.LatLng(46.5376919, 4.5425704),
                    date : "5/8/2017 5:11:00 PM",
                    free : true
                });

주기적으로 3000 개 항목을 계산하므로 스크립트에서 파일이 커지고 크롬 소스에서 파일이 비어 있습니다. (나는 약간의 제한에 도달했다고 생각합니다)

100 개의 항목을 제거하여 파일을 작게 만든 후 제대로 작동했습니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.