Outils JavaScript et TypeScript
Lorsque vous utilisez JavaScript ou TypeScript pour programmer une partie ou l'intégralité de la logique de votre application, vous pouvez compter sur ReSharper. Ses fonctionnalités sont disponibles dans les fichiers .js, .ts, .d.ts et .json, dans le code JavaScript intégré aux fichiers HTML et dans la syntaxe JSX.
Analyse du code
Les fonctionnalités d'analyse de code de ReSharper vous aident à repérer rapidement et corriger les erreurs et problèmes avec environ 100 inspections de code pour JavaScript et TypeScript, ainsi que près de 50 inspections supplémentaires réservées à TypeScript. Presque tous les problèmes détectés peuvent être corrigés instantanément avec les correctifs rapides.
Dans l'exemple présent, saisir = là où == était prévu peut entraîner un bug très subtil... ce qui n'est pas le cas avec ReSharper.
Lors de l'analyse de votre code, ReSharper prend en considération le niveau de langage qui est configurable. Par défaut, un niveau de langage est basé sur les paramètres du projet, mais vous pouvez ignorer le paramètre si nécessaire.
Navigation et recherche
La plupart des fonctionnalités de navigation et recherche de ReSharper sont disponibles en JavaScript et TypeScript. Comme d'habitude, les commandes de navigation à partir d'un symbole spécifique sont disponibles via le raccourci Navigate To : Alt+`.
Toutes vos commandes de recherche préférées, comme Ctrl+T (Go to Everything/Type) et Ctrl+Shift+T (Go to File), sont également disponibles. Toutes les fonctionnalités de navigation et de recherche prises en charge prennent en considération les spécificités des syntaxes JavaScript et TypeScript. Par exemple, File Structure peut afficher les types de donnée des paramètres s'ils sont spécifiés dans la documentation XML.
Structural Search and Replace reconnaît également la syntaxe JavaScript/TypeScript.
Saisie automatique du code
Les fonctionnalités de saisie automatique de code vous aident à écrire plus vite votre code JavaScript/TypeScript. Pendant que vous tapez, ReSharper analyse le contexte environnant et les symboles que vous avez récemment utilisés pour pouvoir vous suggérer les bonnes valeurs via la liste de saisie automatique. Par exemple, ReSharper peut vous aider à trouver les méthodes et propriétés intégrées à JavaScript, ainsi que les symboles des bibliothèques JavaScript référencés dans le projet actuel.
Actions contextuelles et autres assistants
ReSharper vous permet de rapidement convertir des sections de votre code JavaScript/TypeScript grâce à 50 actions contextuelles pour JavaScript et TypeScript, et environ 20 actions spécifiques à TypeScript.
L'arsenal complet des autres outils d'assistance au codage de ReSharper, le surlignage de la syntaxe, la réorganisation du code, l'extension/réduction de sélection, pour en citer quelques uns, est également à votre disposition pour les codes JavaScript et TypeScript.
Prise en charge de JSDoc
ReSharper rend les commentaires JSDoc bien plus faciles à lire grâce à la mise en valeur de leur syntaxe. Quand vous écrivez des commentaires JSDoc, ReSharper vous aide à compléter votre saisie. Par exemple, vous pouvez écrire /** au-dessus d'une fonction et ReSharper générera les extraits de documentation pour tous les paramètres et pour la valeur de renvoi. Les types, typedefs et callbacks JSDoc sont également correctement mis en valeur et deviennent disponibles en saisie automatique de code.
De plus, tous les commentaires JSDoc laissés sur des symboles sont disponibles sur les utilisations de ces symboles dans la fenêtre contextuelle Quick Documentation.
Assistance pour les expressions régulières
La prise en charge des expressions régulières de ReSharper couvre l'interprétation complète des expressions régulières de JavaScript/TypeScript. Par défaut, les expressions régulières sont reconnues dans les littéraux d'expression régulière,
dans les méthodes et constructeurs RegExp, ainsi que dans les méthodes
d'objets String :
match(), search(), replace(), split(). Cependant, vous pouvez toujours dire à ReSharper d'analyser n'importe quel littéral de chaîne comme une expression régulière.
Refactorisations
Dans le code JavaScript et TypeScript, vous pouvez profiter de plusieurs refactorisations qui fonctionnent comme en C# : Inline Variable, Introduce Variable, Introduce Variable for Substring et Rename.
En TypeScript, un jeu de refactorisations sur types est disponible : Copy Type, Introduce Field, Move Type to Another File or Namespace et Move to Folder.
Il existe également une refactorisation spécifique à JavaScript/TypeScript : Move to Resource. Cette refactorisation fonctionne dans les projets JavaScript/TypeScript créés à partir de modèles Visual Studio (ex : Apache Cordova) et permet de déplacer des littéraux de chaîne vers des fichiers de ressources.
Toutes les refactorisations JavaScript/TypeScript sont également disponibles en syntaxe JSX.
Créer à partir d'une utilisation
ReSharper vous permet d'utiliser des symboles non existants puis de générer les implémentations adaptées en fonction de ces utilisations dans presque tous les langages pris en charge. JavaScript et TypeScript ne font pas exception : pour tout symbole non résolu, ReSharper suggère un ou plusieurs moyens de le créer.
Générer des constructeurs
Lorsque vous appuyez sur Alt+Insert sur une déclaration de type TypeScript, ReSharper vous permet de créer rapidement un constructeur pour ce type. L'assistant de génération de constructeur crée un constructeur différent du constructeur par défaut, qui prend comme paramètres les champs sélectionnés du type et des types de base.
Implémenter/Remplacer des membres
Les types hérités sont liés à deux fonctionnalités de génération de code :
- Implement missing members implémente n'importe quel membre d'interface ou membre abstrait manquant de la classe actuelle ;
- Override members fait de même, mais peut aussi remplacer les membres virtuels le cas échéant.
Modèles de code
ReSharper propose des douzaines de modèles dynamiques qui couvrent toutes les constructions de code fréquemment utilisées en JavaScript et TypeScript. Il y a également des modèles postfix pour TypeScript et JavaScript, ainsi que des modèles de fichier pour classes, interfaces et modules TypeScript. Vous pouvez enrichir le jeu par défaut de modèles grâce à vos propres modèles personnalisés.
Assistance au style de code
ReSharper vous aide à entretenir automatiquement les deux piliers du style de code en JavaScript et TypeScript : les règles de mise en forme du code et les conventions de dénomination.
En fait, la mise en forme du code fonctionne même mieux qu'en C# : appuyez sur Alt+Entrée sur le bloc de code et choisissez pour voir et configurer toutes les règles de mise en forme qui affectent le bloc sélectionné.
Les préférences de style de code spécifiques à JavaScript et TypeScript sont disponibles : vous pouvez maintenir une utilisation consistante des guillemets simples (') ou doubles (") pour gérer les littéraux des chaînes, et ajouter ou supprimer automatiquement les points-virgules facultatifs des déclarations.
En TypeScript, vous pouvez en plus contrôler comment spécifier les types dans les déclarations
(nom de type explicite,
var, ou any), si le modificateur
public est utilisé explicitement, et comment importer des modules.
Toutes les préférences de style de code JavaScript et TypeScript peuvent être appliquées dans n'importe quelle portée grâce à une seule commande, en utilisant des correctifs rapides ou le nettoyage du code.
Assistance aux tests unitaires
ReSharper aide à découvrir et à exécuter les tests unitaires en fonction de QUnit et Jasmine, directement depuis Visual Studio. Vous allez pouvoir sélectionner quel navigateur utiliser pour exécuter vos tests JavaScript/TypeScript, ou opter pour des tests à l'aveugle avec PhantomJS.
Comme pour les tests unitaires en .NET, vous pouvez parcourir ceux en JavaScript/TypeScript dans votre solution grâce à Unit Test Explorer, les exécuter à partir de cette fenêtre, du Solution Explorer ou de l'éditeur. Vous pourrez également utiliser plusieurs sessions de tests unitaires.
JSLint, ESLint, et TSLint
ReSharper développe les règles d'analyse de code intégré avec prise en charge de trois outils d'analyse statique : JSLint, ESLint et TSLint. Tous ces linters aident à assurer que le code JavaScript et TypeScript soit lisible et facile à entretenir. Ils autorisent également l'ajout de règles personnalisées qui peuvent être incluses dans l'analyse de code ReSharper.
Si un interpréteur Node.js est déjà configuré sur votre machine, vous pouvez activer les linters dans les paramètres ReSharper sous Tools | Web Linters
Assistants de valeur JSON et catalogues de schémas
Les assistants de valeur JSON vous permettent de dire à ReSharper de fournir la saisie ou la validation automatique du code pour vos propres fichiers JSON. Vous pouvez ajouter dans la page d'options JSON Value Helpers un assistant basé sur un masque de nom de fichier et/ou une correspondance de schémas. Les catalogues de schémas JSON personnalisés peuvent être ajoutés dans les options JSON.
Remarque sur les raccourcis
Tous les raccourcis clavier indiqués sur cette page sont disponibles dans la configuration clavier "Visual Studio" par défaut de ReSharper . Pour en savoir plus sur les deux configurations clavier de ReSharper, consultez la Documentation ReSharper.