8
votes

Comment déboguer WebPack-dev-Server (en mémoire) avec WebStorm?

Selon la zone Web, ils ont besoin de déboguer contre un répertoire de dist spécifié dans: https://blog.jetbrises.com/webstorm/ 2015/09 / débogage-webpack-applications-in-webstorm /

Toutefois, selon le processus de développement recommandé sur le WebPack, nous devrions exécuter WebPack-dev-Server, de sorte que tout en mémoire dans:

Webpack-dev-Server -Inline -PROGRESS -COLORS -DISPLAY-ERROR-DÉTAILS -DISPLAY-CACHED -HOT -HOT -PORT = 3000

Donc, il n'y a pas de répertoire dist, qui contrattage des exemples postés @: https://blog.jetbrains.com/webstorm/2015/09/debugging-webpack-applications-in-webstorm/

Y a-t-il un moyen d'utiliser WebPack-dev-Server d'utiliser Dist Dist Dist Distor afin que la zone Web puisse être mappée à celle-ci afin que nous puissions utiliser des cartes de source pour déboguer en direct?

FYI C'est le projet que j'utilise pour tester:

https://github.com/ocombe/ng2-webpack

tx

Sean


0 commentaires

4 Réponses :


2
votes

Comme vous le savez, vous devrez créer un paquet de distribution / production avec des cartes source, puis d'utiliser cela pour le débogage dans la zone Web. Personnellement, je passe des tests avec le karma pendant que j'ai le Webpack-dev-Server en cours d'exécution. Les tests de karma peuvent être exécutés avec le débogueur et qui satisfait généralement à tous mes besoins de débogage, tandis que le WebPack-dev-Server fournit mon "test manuel" pour voir comment je vais.

Je suppose que je suppose que ce que je dis pour votre cas ... Vous pouvez avoir le serveur DEV en cours d'exécution pendant, en même temps, avoir une sorte de construction automatisée avec des cartes source exécutées à la même même période que vous pouvez exécuter et Utilisez le débogueur sur. Cela peut être intensif cependant cela dépend de votre mémoire et de votre puissance de traitement.


2 commentaires

Oui, tout en utilisant mon coureur de tâche Karma. Je ne sais pas si vous utilisez des tests, mais c'est pourquoi j'imaginais que vous puissiez exécuter un processus en même temps pouvant être débogué, même si le dev-serveur ne peut pas.


Réponse mise à jour, espérons-le, pour une meilleure clarté.



2
votes

J'ai fini par utiliser Live-Server https://github.com/tapio/live-server - a> et suivi ce tutoriel, travaillé ... https : //blog.jetbrains.com/webstorm/2015/09/debugging-webpack-applications-in-webstorm/ (je ne peux tout simplement pas utiliser le serveur intégré dans WebPack, mais c'est ok)


0 commentaires

5
votes

Actuellement de WebStorm Besoins le Bundle créé + SourceMap de WebPack pour l'analyser et trouver le point d'arrêt réel.

Donc en bref, vous ne pouvez pas Débogou WebPack Applications Just avec le WebPack devserver . Cependant, vous pouvez exécuter la bande Web Normal Boîte avec le fichier en regardant en parallèle: `


0 commentaires

1
votes

J'ajouterais que vous pouvez mettre la déclaration

débogueur;

Dans vos fichiers JavaScript / Typescript, même dans les fichiers de cadre de Angular ou de Vue2 comme * .vue

Donc, même si vos mappages de chemin à l'URL ne fonctionnent pas, cela ne marchera de toute façon.


0 commentaires