web-dev-qa-db-fra.com

Comment utiliser NPM et installer des packages dans Visual Studio 2017?

J'ai une simple solution Visual Studio, exécutant ASP.NET Core v2 et construisant une application React.

Maintenant, je veux installer un composant simple en utilisant le NPM. Dans cet exemple particulier, cela pourrait être:

npm install --save react-bootstrap-typeahead

Je veux que ce paquet fonctionne uniquement dans ma solution et nulle part ailleurs.

Mon résultat:

Lorsque je lance ceci, j'obtiens l'erreur Nice suivante, qui a évidemment un sens. Si NPM pense qu'il peut trouver mon fichier de projet à 'C:\Users\LarsHoldgaard\package.json', c'est sans chance. Le chemin correct serait C:\Users\LarsHoldgaard\Documents\Github\Likvido.CreditRisk\Likvido.CreditRisk\Likvido.CreditRisk.

npm : npm WARN saveError ENOENT: no such file or directory, open 'C:\Users\LarsHoldgaard\package.json'
At line:1 char:1
+ npm install --save react-bootstrap-typeahead
+ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    + CategoryInfo          : NotSpecified: (npm WARN saveEr...d\package.json':String) [], RemoteException
    + FullyQualifiedErrorId : NativeCommandError

npm

WARN

enoent
 ENOENT: no such file or directory, open 'C:\Users\LarsHoldgaard\package.json'

npm

WARN
 [email protected] requires a peer of grunt@>=0.4.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react@>=0.13.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react@^0.14.0 || ^15.2.0 || ^16.0.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react-dom@^0.14.0 || ^15.2.0 || ^16.0.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react@>=0.14.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react@^0.14.9 || >=15.3.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react-dom@^0.14.9 || >=15.3.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react@^15.5.x || ^16.x but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react-dom@^15.5.x || ^16.x but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react@>=15.0.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 [email protected] requires a peer of react-dom@>=15.0.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 LarsHoldgaard No description

npm

WARN
 LarsHoldgaard No repository field.

npm

WARN
 LarsHoldgaard No README data

npm

WARN
 LarsHoldgaard No license field.

Ma pensée:

Etant un console noob , je suppose que je devais juste changer mon dossier actuel. Mais si je lance dir, je suis dans le bon dossier et je peux voir mon package.json avec d’autres fichiers.

Quelle est la bonne façon d'installer des composants?

asp.netvisual-studionpmasp.net-corevisual-studio-2017
8
Lars Holdgaard

Pour éviter de naviguer manuellement dans le bon répertoire, utilisez l’extension "Ouvrir la ligne de commande" de Mads Kristensen. Il est disponible gratuitement sur le marché. Vous le trouvez ici .

Une fois installé, vous pouvez ouvrir une invite de commande directement à partir de Visual Studio.

 enter image description here

Conseil: utilisez le raccourci clavier ALT + Espace au lieu du menu contextuel pour ouvrir la commande Invite.

Vous pouvez ensuite exécuter votre commande npm:

npm install react-bootstrap-typeahead

Remarque secondaire: à partir de npm 5.0.0, les modules installés sont ajoutés en tant que dépendance par défaut. Par conséquent, l'option --save n'est plus requise.

9
Postlagerkarte

Je pense que le moyen le plus simple est d'utiliser simplement l'interface utilisateur fournie par Visual Studio.

Créez un package.json à la racine de votre projet (c.-à-d., Faites un clic droit sur votre projet, ajoutez un élément et recherchez NPMname__. Vous trouverez un npm Configuration File):

{
  "name": "SomeName",
  "version": "1.0.0",
  "private": true,
  "devDependencies": {
    "react-bootstrap-typeahead": "*"
  }
}

Notez que * correspond à la dernière version. Ceci n'est pas recommandé. Mieux vaut spécifier la version que vous voulez. Vous remarquerez que intellisence est pris en charge pour les versions et les noms de package.

Chaque fois que vous apportez des modifications au fichier JSON, il suffit d'appuyer sur CTRL + S. Visual Studio appelle automatiquement NPM et restaure les packages.

Pour savoir comment utiliser la ligne de commande, d’autres ont déjà répondu. Mais étant moi-même une ligne de commande, je préfère cette façon.

10
Christian Gollhardt
  • Dans l'explorateur de Windows, accédez à l'emplacement où se trouve le fichier package.json dans votre projet. 
  • Créez un dossier nommé node_modules dans le même répertoire que votre fichier package.json
  • Tout en maintenant la touche [Shift] gauche, cliquez avec le bouton droit de la souris sur le dossier contenant le fichier project.json. 
  • Dans le menu contextuel, sélectionnez "Ouvrir la fenêtre de commande ici". 
  • Entrez votre commande npm npm install --save react-bootstrap-typeahead
0
AperioOculus