Reaguj na narzędzia deweloperskie - wyłącz opcję „przerwy w ostrzeżeniach”

87

Podczas programowania za pomocą aplikacji create-react-app moja przeglądarka wchodzi w tryb debugera po ostrzeżeniach:

Łamie kod źródłowy react-dev-tools:

   // --- Welcome to debugging with React DevTools ---
   // This debugger statement means that you've enabled the "break on warnings" feature.
   // Use the browser's Call Stack panel to step out of this override function-
   // to where the original warning or error was logged.

Jak mogę dezaktywować to zachowanie?

reactjs javascript-debugger

— cadoman
źródło

16

Takie zachowanie jest całkowicie irytujące. Naprawdę chciałbym wiedzieć, jak to wyłączyć

— guillaume

3

tutaj jest instrukcja krok po kroku autorstwa Dan github.com/facebook/react/issues/19308#issuecomment-656682924, aby usunąć to zachowanie na razie

— Alireza,

1

Moje rozwiązanie polegało na umieszczeniu w czarnej skrzynce tego konkretnego pliku, aby debugger go całkowicie pominął. Jeśli nie tworzysz tej wtyczki, powinieneś to zrobić.

— Derek

81

Przejdź do Chrome Devtools → w konsoli Chrome, przejdź do Komponent → Kliknij Ustawienia → odznacz Przerwij przy ostrzeżeniu . Zrób to samo w Profiler → Settings → unset Break on warning .

@cadoman wskazał check, a następnie odznacz, aby upewnić się, że działa.

PS: Zdjęcie z https://github.com/facebook/react/issues/19308#issuecomment-656669792

— Naresh Kumar
źródło

31

I musisz sprawdzić, a następnie odznaczyć, jeśli jeszcze nie jest zaznaczone

— cadoman

Wydaje się również, że występuje błąd polegający na tym, że pole wyboru jest pomylone między ustawieniami Profiler i Component. Zaznacz lub odznacz jedną, a druga pokaże ostatnią wartość. Więc jak powiedział cadoman, po prostu zaznacz i odznacz.

— rdzeń reaktywny

haaa, znalazłem cię :)

— 7urkm3n

15

Na podstawie żądania ściągnięcia DevTools: Domyślnie wyłącz ostrzeżenie przed włamaniem # 19309 wydaje się, że to błąd.

Pole Break On Warnings nie było zaznaczone i nadal się zepsuje. Usunięcie i odczytanie rozszerzenia w celu wymuszenia aktualizacji naprawiło to za mnie.

Nie znam innego sposobu, aby zmusić Chrome do zaktualizowania rozszerzenia poza zwykłym harmonogramem.

— Chris Weiss
źródło

4

Przejdź do narzędzi ReactDev w zakładce Debugowanie i wyłącz „Przerwa przy ostrzeżeniu”.

Myślę, że to nowe zachowanie zaczęło się dzisiaj od nowego PR: https://github.com/facebook/react/pull/19048

— Adriano Costa
źródło

3

Chrome ma funkcję „skryptu BlackBox”, która jest przydatna w tym przypadku.

Przejdź do Chrome Developer Tools -> zakładka source
W lewym okienku wybierz „act_developer_tools.js”
Kliknij plik prawym przyciskiem myszy i wybierz „Skrypt czarnej skrzynki”

— Bidyashish Kumar
źródło

3

To znany problem. Obejście zostało opublikowane na GitHub: Błąd: Nieoczekiwana instrukcja debuggera w DevTools (rozwiązana) # 19308

— Doug G.
źródło

3

Problem jest spowodowany niedawnym wydaniem. Obejście zaproponowane przez zespół React to:

Przejdź do Chrome Developer Tools
Kliknij kartę Komponenty (rozszerzenie React Developer Tools)
Kliknij ikonę Ustawienia (znajdującą się obok pola wyszukiwania komponentów)
Po otwarciu modalnego wybierz kartę Debugowanie
Na koniec kliknij dwukrotnie pole wyboru Przerwij przy ostrzeżeniach (zaznacz i odznacz)

Upewnij się, że pole wyboru Break on Warnings jest odznaczone.

Odniesienie: link do wydania

— Malaji Nagaraju
źródło