web-dev-qa-db-fra.com

Comment importer des fichiers Intellisense dans vsCode (Visual Studio Code)

Je ne suis pas sûr de comprendre comment l'intellisense fonctionne pour le nouvel éditeur de texte vsCode de Microsoft. Dans la rubrique docs sous la rubrique "Great Code Editing Experience" , il affiche un avertissement sous la variable globale de nœud __dir et propose une suggestion d'ampoule pour ajouter une référence à un fichier d.ts afin que vous puissiez obtenir intellisense pour le nœud:

enter image description here

J'ai 2 questions:

1 - Comment importer directement DefinitelyTyped fichiers (d.ts) (sans que l'éditeur ne le suggère) ou dois-je les copier depuis la source github et les mettre dans un répertoire de typage?

2 - Puis-je obtenir intellisense pour toute bibliothèque qui a une définition TypeScript? J'ai essayé ce qui suit, mais quand je tape express. ou when., Je n'ai pas d'intellisense. Cependant, j'obtiens un nœud intellisense.

/// <reference path="../typings/node/node.d.ts"/>
/// <reference path="../typings/express/express.d.ts" />

var when    = require('when')
  , express = require('express')
  , gulp    = require('gulp')
32
kurtcorbett

MISE À JOUR: août 2016: TSD est désormais amorti. utilisez plutôt https://www.npmjs.com/package/typings

npm install typings --global

OR

Si vous utilisez VS2015 NodeJS v1.2 sorti le 29 juillet 2016, alors [email protected] est installé automatiquement pour vous lors de la première utilisation:

Executing command 'npm install "C:\PROGRAM FILES (X86)\Microsoft VISUAL STUDIO 14.0\COMMON7\IDE\EXTENSIONS\Microsoft\NODE.JS TOOLS FOR VISUAL STUDIO\1.2\TypingsAcquisitionTool"
[email protected] ..\..\..\..\..\node_modules\ntvs-typings-acquisition-tool
├── [email protected]
└── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])

----- Réponse originale -----

Il existe un gestionnaire de packages pour les fichiers de définition TypeScript. Il s'agit d'un référentiel géré par la communauté contenant des définitions TypeScript pour de nombreuses bibliothèques populaires.

Vous pouvez installer tsd en suivant les instructions ici .

Une fois que vous avez installé tsd globalement, vous pouvez installer des packages à partir de la racine de votre projet dans la ligne de commande comme ceci:

$ tsd install express --save

Cela créera un répertoire de typage s'il n'en existe pas et ajoute un répertoire express avec un express.d.ts fichier à l'intérieur.

Screenshot

Il crée également un tsd.d.ts fichier contenant les références à tous vos fichiers tsd. Si j'installe quelques tsd supplémentaires, voici à quoi cela ressemble.

enter image description here

Maintenant, pour accéder à mes fichiers tsd, tout ce que je dois faire est de référencer leur chemin en haut de mon code avec /// <reference path="typings/tsd.d.ts" />

enter image description here

Maintenant, je reçois Intellisense.

enter image description here

49
kurtcorbett

En janvier 2016, le package "tsd" était obsolète. Utilisez plutôt le package "typings".

Voir https://github.com/DefinitelyTyped/tsd/issues/269

Et vous pouvez trouver dans VS Code (installation externe) deux extensions - Typings Installer et Typings qui permet d'installer facilement les fichiers de définition d.ts à partir de VS Code.

16
Dima Fomin

Vérifiez si vous travaillez en mode Explicit Project (REF: https://code.visualstudio.com/Docs/languages/javascript# _javascript-projects-jsconfigjson )

Qu'est-ce qui se passe?

Dans le mode de projet explicite , VS Code utilise des fichiers "main.d.ts" sous le dossier de typages pour intellisense. Ce fichier fera référence à d'autres fichiers de définition et donc l'intellisence fonctionne parfaitement. Dans mon cas, le main.d.ts ressemble à ce qui suit

/// <reference path="main/ambient/express-serve-static-core/index.d.ts" />
/// <reference path="main/ambient/express/index.d.ts" />
/// <reference path="main/ambient/node/index.d.ts" />
/// <reference path="main/ambient/serve-static/index.d.ts" />

Dans le mode de portée de fichier , VS Code ne vérifie pas les définitions de typage et donc aucune intelligence. Dans ce cas, pour ajouter l'intelligence, la balise de référence sera utile lorsque vous référerez la définition manuellement. Si vous faites référence manuellement, reportez-vous à main.d.ts sous les saisies plutôt que de rechercher la définition d'une bibliothèque spécifique. Cela rendra votre code moins dense en référence.

Notez également que l'équivalent TypeScript pour jsconfig.json est tsconfig.json qui mettra également l'éditeur en mode Explicit Project.

3
Mahesh V S

Vous pouvez y parvenir avec le fichier jsconfig.json après la version d'avril 2017.

Exemple de contenu du fichier:

{
 "typeAcquisition": {
     "include": [
         "jquery",
          "underscore"
     ]
   }
}

Voir la référence jsoncifg.json pour VSCode ici.

3
kepils

J'ai obtenu express express pour travailler avec express en téléchargeant le express.d.ts fichier de https://github.com/borisyankov/DefinitelyTyped , et en le référençant avec un chemin d'accès par rapport au répertoire de mon projet:

/// <reference path="express.d.ts"/>

J'essaie toujours de trouver ce que /typings fait référence à. Il pourrait également être intéressant de configurer d.ts fichiers dans le cadre des paramètres du projet.

Modifier:

Je l'ai trouvé.

~/Downloads/VSCode-osx
▶ find . -type d -name "typings"
./Visual Studio Code.app/Contents/Resources/app/node_modules/applicationinsights/Scripts/typings

Ils ont donc node, async et applicationInsights intégrés dans le fichier OSX .app par défaut. Tout ce que vous voulez, je suppose que vous pouvez simplement l'inclure comme je l'ai fait ci-dessus.

Modifier Modifier:

Le gestionnaire de paquets tsd mentionné par @kurtcorbett a l'air bien, utilisez-le.

1
Andrew Lavers

Si vous souhaitez installer automatiquement les définitions de types pour vos packages, vous pouvez télécharger l'extension Types auto installer . Il surveillera votre package.json et bower.json et installe automatiquement les types pour vous.

Je pense que la meilleure partie de cette extension est que vous n'avez pas à inclure le /// reference lignes dans votre code car il installe les types via npm.

1
tamj0rd2

Ce que j'ai fait, c'est toucher l'ampoule et choisir l'option qui disait ajouter une référence à node/node.d.ts au projet.

Après cela, j'ai juste écrit: /// en haut de l'éditeur et cela a fonctionné pour moi.

0
Bandito11