Wie gehe ich zu einer bestimmten Datei in den Chrome Developer Tools?

97

Ich entwickle eine Webanwendung mit einem starken Front-End-Ansatz. Mit Dojo und AMD-way habe ich derzeit Testbildschirme, auf denen problemlos über hundert verschiedene Javascript-Dateien geladen werden können.

Wenn ich nach einem bestimmten Problem debuggen oder überprüfen möchte, ob eine alte Version einer bestimmten Datei angezeigt wird, fällt es mir sehr schwer, meine Dateien auf der Registerkarte "Quellen" in den Chrome Developer Tools zu finden.

Gibt es eine Verknüpfung oder Aktion, mit der ich den Namen einer Datei eingeben und zur Quelle dieser Datei gelangen kann?

javascript debugging google-chrome google-chrome-devtools frontend Alpha
quelle
2
Unten rechts auf der Konsole befindet sich ein Zahnradsymbol. Klick es. Auf der letzten Registerkarte im Einstellungsfenster befindet sich eine Registerkarte mit Verknüpfungen. Sie können die Tastenkombinationen wie die Antwort sehen.
Epascarello
Verwenden Sie "Zur Datei gehen" in Google Dev Tools (ein flexibles und nützliches Tool mit der Fähigkeitssuche nach Ihrem Funktionsnamen, Klassennamen in CSS, ...). "Zur Datei gehen" in Google Dev Tools
Iman Bahrampour

Antworten:

142

Verwenden Sie auf der Registerkarte Quellen CTRL+ O( ⌘+)O für Mac), um Skripte, Stylesheets und Snippets nach Dateinamen zu durchsuchen.

(Verwenden Sie CTRL+ SHIFT+ O, um beim Anzeigen einer Datei eine JavaScript-Funktion / CSS-Regel zu filtern / zu navigieren.)

[ Chrome Devtools Cheatsheet ]

CD..
quelle
Das ist gut zu wissen! Früher (vor Chrome 35?) Konnten Sie eine Dateinamensuche starten, indem Sie einfach mit dem Datei-Navigator auf der Registerkarte "Quellen" tippen. Es ist gut zu wissen, dass sie diese Funktion hinter einer Verknüpfung versteckt haben, anstatt sie vollständig zu entfernen. =)
Rakslice
Die Einschränkung beim Filtern / Suchen besteht darin, dass Sie scheinbar keine genauen Suchvorgänge oder Platzhalter durchführen können. Die Suche nach .jsgibt eine Datei mit einem joder einem soder einem .im Dateinamen zurück: /
worc
15

CTRL+ Pruft die Sucheingabe in Windows auf.

Geben Sie hier die Bildbeschreibung ein

⌘+ P- in Mac.

Geben Sie hier die Bildbeschreibung ein

Aleksei Mialkin
quelle
2
Ound Pscheinen das gleiche Verhalten zu haben. Ich frage mich, ob man veraltet ist.
Isherwood
2

In Windows:

Verwenden Sie CTRL+ SHIFT+ F , um nach Inhalten in Dateien zu suchen.

Verwenden Sie CTRL+ SHIFT+ O , um nach Dateinamen zu suchen.

Live-Liebe
quelle
0

Mac: Befehl + O Windows: Strg + O.

Jackie
quelle