Existe-t-il un moyen rapide de passer du code jsx affiché dans Chrome DevTools à l'ES5 brut et vice-versa?
Désactiver les cartes sources dans Chrome DevTools
Réponses:
Ouvrez les outils de développement, allez dans "Paramètres" pour les outils de développement, puis décochez Enable JavaScript Sourcemapssous les paramètres "Sources".
6
Merci j'ai vu ça. Malheureusement, la modification de cette option nécessite une actualisation avant de prendre effet. J'espérais qu'il y aurait un moyen de basculer l'option sans actualisation.
—
Jack Allan
Nan. Parce que les sources doivent être réinterprétées en fonction du paramètre.
—
Garbee
Merci, je suis curieux de savoir pourquoi cela est nécessaire, car il exécute toujours l'es5 sous le capot et le mappage de la source informe simplement le débogueur de la ligne sur laquelle se trouve la déclaration actuelle dans le code source?
—
Jack Allan
Pour ceux qui ont du mal à trouver ces paramètres comme moi, voir ceci: i.imgur.com/9aMlBfg.png
—
joshcomley
J'ai juste essayé ceci et cela semble avoir un effet immédiat, c'est-à-dire qu'aucune actualisation de page ne semble plus nécessaire.
—
Jackson
Vous pouvez double-cliquer sur les numéros de ligne pour passer des fichiers source aux fichiers de sortie non réduits. A part cela, il semble limité. Voir le commentaire ci-dessous.
J'ai trouvé cela utile pendant le développement. Lorsque vous utilisez webpack-dev-server(ou un autre outil) sans minimiser js, vous pouvez double-cliquer sur les numéros de ligne dans les fichiers source pour accéder au fichier de sortie compilé mais non réduit.
Je viens de découvrir cela par accident, puis j'ai trouvé ce commentaire du 21 décembre 2016: https://bugs.chromium.org/p/chromium/issues/detail?id=532174#c7
Vous pouvez double-cliquer sur le numéro de ligne pour sauter dans le fichier d'origine, mais c'est assez inutile si le fichier minifié a toutes les nouvelles lignes supprimées :(
Avoir un word wrap améliorerait ce travail https://bugs.chromium.org/p/chromium/issues/detail?id=167287
Je pense qu'il y avait un support pour double-cliquer sur une section du fichier minifié pour sauter dans le fichier mappé source, mais il semble avoir régressé ces derniers temps.
Idéalement, dans un fichier minifié avec une carte source, un clic droit (ou un double clic) n'importe où dans le fichier minifié devrait permettre de sauter à ce fichier, cette ligne et cette colonne exacts.
Lorsque je double-clique sur un numéro de ligne, il ajoute puis supprime un point d'arrêt. Est-ce que je manque quelque chose?
—
emclain
Idk. Cela ne semble le faire que de temps en temps. Et seulement si Chrome semble aimer le sourcemap. Vous pouvez essayer différentes lignes ou différents projets, mais je n'ai pas vraiment de meilleures suggestions. Chrome devrait mieux le supporter.
—
Scotty Wagoner