Maison  >  Article  >  interface Web  >  Développer Vue à l'aide de vue-devtools

Développer Vue à l'aide de vue-devtools

巴扎黑
巴扎黑original
2017-07-21 13:47:232456parcourir

Avant-propos :

Étant donné que vue est basée sur les données, il existe un problème selon lequel rien ne peut être analysé en visualisant la structure DOM pendant le développement et le débogage.

Mais avec l'aide du plug-in vue-devtools, nous pouvons facilement analyser et déboguer la structure des données.

1. Téléchargez l'extension Chrome

Adresse de téléchargement GitHub :

Il est recommandé d'utiliser le miroir npm Taobao et de suivre le package de dépendances

Adresse :

Installation en ligne de commande du miroir npm Taobao :

$ npm install -g cnpm --registre= https://registre.npm.taobao.org

Ensuite, nous pouvons utiliser cnpm au lieu de npm pour suivre les packages de dépendances. en effet trop lent pour installer les packages de dépendances....

2. cnpm install

Une fois le téléchargement terminé, ouvrez la ligne de commande cmd et entrez dans le dossier vue-devtools, suivez les instructions. package de dépendances et npm run build

3. Ouvrez shells>chrome>src>manifest.json et modifiez "persistent". :false dans le fichier json sur true

4. Étendre le plug-in Chrome

1. Ouvrez le navigateur Chrome, ouvrez Paramètres> Cliquez sur ou Programmes. >Cliquez sur Mode développeur

2. Cliquez ensuite pour charger l'extension décompressée, puis placez le dossier shell>chrome dans

Enfin.

ouvrez celui écrit par vue Project, f12 ouvre l'outil de débogage pour déboguer le projet vue.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent:Nouvelles connaissances HTML5Article suivant:Nouvelles connaissances HTML5