La séparation front-end et back-end complique le débogage des points d'arrêt frontaux. Pour déboguer la vue dans Chrome, vous devez d'abord installer le plug-in Debugger for Chrome dans vscode, puis ajouter une configuration de débogage pour modifier le lancement. fichier de configuration json; vous pouvez vous référer aux étapes du site officiel de vue: debug vue dans chrome
Pendant le processus d'intégration, vous pouvez utiliser le débogueur pour effectuer des opérations de débogage sur la ligne de fichier js spécifiée, ou vous pouvez définir les devtools dans le fichier vue.config.js pour afficher la source à l'avant au moment de l'exécution: les devtools de webpack ; vous peut également ouvrir directement chrome dans le vscode Effectuer une opération de débogage;
// vue.config.js文件中设置devtools
config
.when(process.env.NODE_ENV === 'development',
config => config.devtool('source-map')
)1. Installez le débogueur pour Chrome
Comme suit, installez-le dans le bouton d'extension du plug-in de vscode, ou installez-le directement après l'avoir téléchargé dans chrome: débogueur
2. Ajoutez le fichier de configuration launch.json et modifiez la configuration de débogage de chrom, où l'url est l'url d'entrée du projet en cours;
3. Interrompez l'opération au point d'interruption, et la lecture dans le coin supérieur gauche fera apparaître une page du projet en cours d'exécution dans chrome;
