Comment accéder à un fichier spécifique dans les outils de développement Chrome?

97

Je développe une application web avec une approche front-end lourde. En utilisant Dojo et AMD-way, j'ai actuellement des écrans de test qui peuvent facilement charger plus d'une centaine de fichiers javascript différents.

Lorsque je souhaite déboguer pour un problème spécifique ou vérifier si je vois une ancienne version d'un fichier spécifique, je trouve très difficile de trouver mes fichiers dans l'onglet Sources des outils de développement Chrome.

Y a-t-il un raccourci ou une action que je peux faire qui me permettra de taper le nom d'un fichier et de me diriger vers la source de ce fichier?

javascript debugging google-chrome google-chrome-devtools frontend Alpha
la source
2
En bas à droite de la console, il y a une icône d'engrenage. Cliquez dessus. Sur le dernier onglet de la fenêtre des paramètres, il y a un onglet de raccourcis. Vous pouvez voir les combinaisons de touches comme la réponse.
epascarello
Utilisez 'Aller au fichier' dans Google Dev Tools (un outil flexible et utile avec des capacités de recherche sur le nom de votre fonction, le nom de la classe en CSS, ...) 'Aller au fichier' dans Google Dev Tools
Iman Bahrampour

Réponses:

142

Dans l'onglet sources, utilisez CTRL+ O( ⌘+ Opour Mac) pour rechercher des scripts, des feuilles de style et des extraits de code par nom de fichier.

(utilisez CTRL+ SHIFT+ Opour filtrer / naviguer vers une fonction JavaScript / règle CSS lors de l'affichage d'un fichier)

[ Cheatsheet Chrome Devtools ]

CD..
la source
C'est bon à savoir! Vous aviez l'habitude (avant Chrome 35?) De pouvoir lancer une recherche de nom de fichier en tapant simplement avec le navigateur de fichiers dans l'onglet Sources ciblé; il est bon de savoir qu'ils ont caché cette fonctionnalité derrière un raccourci plutôt que de la supprimer complètement. =)
rakslice
la mise en garde concernant le filtre / recherche est que vous ne pouvez pas sembler faire des recherches exactes ou des caractères génériques. la recherche .jsrenvoie tout fichier avec un jou un sou un .dans le nom du fichier: /
worc
15

CTRL+ Pfait apparaître l'entrée de recherche dans Windows.

entrez la description de l'image ici

⌘+ P- sous Mac.

entrez la description de l'image ici

Aleksei Mialkin
la source
2
Oet Psemblent avoir le même comportement. Je me demande si l'un est obsolète.
isherwood
2

Sous Windows:

Utilisez CTRL+ SHIFT+ F pour rechercher du contenu dans des fichiers.

Utilisez CTRL+ SHIFT+ O pour rechercher des noms de fichiers.

l'amour en direct
la source
0

Mac: Commande + O Windows: Ctrl + O

Jackie
la source