En trois étapes! Électronique utilisé dans Vue Devtools


Ce faisant récemment avec des applications côté électronique, en utilisant Vue, des outils de débogage nécessitent naturellement, décrits en détail ci-dessous à propos de plug-in Vue.js les devtools de l'électron installation (environnement Windows)

 

  1. Assurez - vous que le plug-in du navigateur Chrome a été installé dans Vue.js DevTools
    extensions ouvertes

    pour voir si Vue.js extensions installées DevTools plug-ins

     

     

     

     Ce qui précède est ce que je l' ai utilisé à la fois l' installation plug-in Chrome. La première version de Chrome est désormais un peu importé d'ailleurs pas les plug-ins de téléchargement directement, il vous sera demandé [Paquet est invalide: « CRX_HEADER_INVALID »], puis utilisez une méthode en ligne après l' extraction du plug-in, charger des extensions non emballés, qui ainsi , vous pouvez voir le plug-in source est l'adresse du décompressé. La deuxième façon est à la recherche est installé à partir du Chrome Web Store est en fait https://pictureknow.com/ téléchargé à partir du site plug-in Chrome, téléchargez le plug-in peut être importé directement sur ce site demande d'extension. Il est recommandé d'utiliser de cette façon, une information d'identification de plus utiles voir ici derrière

  2. Obtenez Vue.js devtools position de montage dans l'ordinateur
    Installé au-dessus de la méthode recommandée pour installer le plug-in Chrome emplacement est dans une position à l'intérieur, au-dessous est mon chemin
  3. Utilisez BrowserWindow.addDevToolsExtension(extension)API 

     

     Ceci est le site officiel de l'électron BrowserWindow.addDevToolsExtension(extension)API sur l'utilisation, en bref, est d'utiliser l'API, le seul paramètre dans le processus principal de chemin de main.js pour le plug-in, la figure au- dessus du chemin d'introduction nœud, modules os sont conçus pour épissures get Vue.js DevTools le chemin, et ici je dirige chemin absolu (simple , )

     

     A cette époque, étant donné, BrowserWindow.addDevToolsExtension n'est pas une fonction, ne devrait pas être ah, API site officiel ne fournit pas une fonction ne doit pas être, ah, puis regarde en arrière les documents:

     

     

    Ensuite, il changer l'emplacement de l'appel API:

     app.on ( « prêt », createWindow) les instructions du moniteur d'événements app.readey déclenche un appel pour créer un événement de la fenêtre, nous allons écrire dans la méthode createWindow BrowserWindow.addDevToolsExtension, puis essayer de nouveau:

     

     

     Succès! ! !

  4. Résumé
    Si le navigateur Chrome n'a pas plug-in Vue Devtools installé, allez https://pictureknow.com/ télécharger et installer
    les plug-ins Chrome installé, les plug-ins pour obtenir l'adresse, le BrowserWindow.addDevToolsExtension ( ' Voici un plug-adresse méthode) écrite dans l'application. après prêt à effectuer


    meilleurs voeux

Je suppose que tu aimes

Origine www.cnblogs.com/hgliu-web/p/12658912.html
conseillé
Classement