134 votes

Comment utiliser WebStorm pour le développement d'extensions pour Chrome ?

Je viens d'acheter WebStorm 5 et jusqu'à présent, j'ai vraiment apprécié ses fonctions d'inspection. Un problème que j'ai rencontré lors du développement de mon extension Chrome est qu'il ne reconnaît pas l'option "Inspection". chrome variable :

Unresolved variable or type chrome

Y a-t-il un moyen d'ajouter le chrome à l'inspecteur pour qu'il puisse se compléter automatiquement lorsque je tape ? Je suppose que je dois ajouter Chromium en tant que bibliothèque externe, mais je ne sais pas par où commencer.

281voto

Miscreant Points 148

Première installation

  1. Ouvrez le Settings dialogue ( File > Settings )

  2. Cliquez sur Languages & Frameworks > Javascript > Libraries

  3. Cliquez sur Download

  4. Assurez-vous que TypeScript community stubs est sélectionné

  5. Sélectionnez chrome de la liste (vous pouvez le trouver rapidement en tapant simplement chrome )

  6. Cliquez sur Download and Install

  7. Cliquez sur OK pour fermer la boîte de dialogue Paramètres.


Les étapes 2 à 6 sont illustrées ci-dessous :

Webstorm Screenshot


Dans les projets ultérieurs

Dans tout projet ultérieur, il suffit de :

  1. Ouvrez le Settings à nouveau ( File > Settings )

  2. Cliquez sur Languages & Frameworks > Javascript > Libraries à nouveau

  3. Vérifiez chrome-DefinitelyTyped

  4. Cliquez sur OK pour fermer la boîte de dialogue.


Les étapes 2 à 4 sont présentées ci-dessous :

Webstorm screenshot

48voto

CrazyCoder Points 103123

MISE À JOUR 2 :

Il est désormais pris en charge dès la sortie de la boîte, voir la page compléter la réponse ci-dessous .

Download library

UPDATE :

Il existe un fichier stub plus complet qui peut être ajouté comme bibliothèque pour obtenir la complétion de code. Il fait partie du projet Closure Compiler. Télécharger chrome_extensions.js .

Voir également le demande de fonctionnalité pour WebStorm pour ajouter cette bibliothèque automatiquement à partir de l'IDE.


Vous devez obtenir la bibliothèque JavaScript pour l'API Chrome quelque part, ou bien utiliser un stub pour obtenir l'achèvement de base .

La bibliothèque ou le talon peut être configuré dans WebStorm .


J'ai trouvé le Fichiers JSON avec l'API d'extension . On peut écrire un script qui construira des stubs JS à partir de ces fichiers JSON, les stubs peuvent ressembler à la version de base liée sur GitHub ci-dessus, mais avec la génération automatique, ils contiendront des commentaires presque complets de l'API et de la JSDoc, de sorte que documentation comme ici peuvent être visualisées directement dans l'IDE.

Le mappage JSON => JavaScript object stubs est assez simple dans ce cas et l'écriture de ce type de convertisseur ne devrait pas prendre plus d'une journée (ou plusieurs heures pour le codeur expérimenté).

Si quelqu'un va de l'avant et le met en œuvre, veuillez poster le lien vers les résultats ici.

2voto

Amitabh Points 56

WebStorm devrait un jour accepter les définitions json directement pour permettre l'autocomplétion des fonctions définies. En attendant, vous pouvez utiliser le programme à https://github.com/QuickrWorld/jsgen pour convertir les fichiers json en js afin d'activer l'auto-complétion pour les API de l'extension chrome.

-2voto

Mingzhong Points 215

Pour écrire de l'AppScript, des fonctions et des classes telles que DriveApp , SpreadsheetApp il existe un plugin dans WebStorm ou Intellij appelé google-app-script.
La méthode d'installation est la même que ci-dessus. En revanche, vous devez marquer ou ouvrir le fichier .gs en tant que JavaScript. (Juillet 2017)

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X