如何在Visual Studio 2017中使用NPM并安装软件包?

问题描述:

我有一个简单的Visual Studio解决方案,它运行ASP.NET Core v2并构建一个React应用.

I have a simple Visual Studio solution, running ASP.NET Core v2 and building a React app.

现在,我想使用NPM安装一个简单的组件.在此特定示例中,可能是:

Now, I want to install a simple component using the NPM. In this particular example, it could be:

npm install --save react-bootstrap-typeahead

我希望该程序包仅在我的解决方案中工作,而在其他地方都不能工作.

I want this package to work just in my solution and nowhere else.

我的结果:

运行此命令时,出现以下不错的错误,这显然是有道理的.如果NPM相信它可以在'C:\Users\LarsHoldgaard\package.json'上找到我的项目文件,那很不走运.正确的路径应为C:\Users\LarsHoldgaard\Documents\Github\Likvido.CreditRisk\Likvido.CreditRisk\Likvido.CreditRisk.

When I run this, I get the following nice error which obviously makes some sense. If NPM believes it can find my project file at 'C:\Users\LarsHoldgaard\package.json', it's out of luck. The correct path would be 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
 grunt-sass@2.0.0 requires a peer of grunt@>=0.4.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 react-rating@1.0.6 requires a peer of react@>=0.13.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 react-bootstrap-typeahead@2.5.1 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
 react-bootstrap-typeahead@2.5.1 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
 prop-types-extra@1.0.1 requires a peer of react@>=0.14.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 react-overlays@0.8.3 requires a peer of react@^0.14.9 || >=15.3.0 but none is installed. You must install peer dependencies yourself.

npm

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

npm

WARN
 react-onclickoutside@6.7.1 requires a peer of react@^15.5.x || ^16.x but none is installed. You must install peer dependencies yourself.

npm

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

npm

WARN
 react-transition-group@2.2.1 requires a peer of react@>=15.0.0 but none is installed. You must install peer dependencies yourself.

npm

WARN
 react-transition-group@2.2.1 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.

我的想法:

作为控制台菜鸟,我想我只需要更改当前文件夹即可.但是,如果运行dir,则我在正确的文件夹中,并且可以看到我的package.json以及其他文件.

Being a console noob, I would guess I just needed to change my current folder. But if I run dir, I am in the right folder, and I can see my package.json along with other files.

什么是正确的组件安装方式?

What is the right way to install components?

为避免手动导航到正确的目录,请使用Mads Kristensen的打开命令行"扩展名.它在市场中免费提供.您可以在此处找到它.

To avoid navigating manually to the correct directory use the "Open Command Line" extension from Mads Kristensen. It is available for free in the Marketplace. You find it here.

安装后,您可以直接在Visual Studio中方便地打开命令提示符.

Once installed you can open a command prompt conviently directly from within Visual Studio.

提示:使用键盘快捷键ALT +空格键而不是上下文菜单打开命令提示符.

Tipp: Use the Keyboard Shortcut ALT+Space instead of the context menu to open the command prompt.

然后您可以运行npm命令:

You can then run your npm command:

npm install react-bootstrap-typeahead

作为旁注:从npm 5.0.0开始,默认情况下已安装的模块作为依赖项添加,因此不再需要--save选项.

As a side note: As of npm 5.0.0, installed modules are added as a dependency by default, so the --save option is no longer required.

更新2019 :

Developer Command Prompt和Developer Power Shell现在已集成到Visual Studio 2019(16.2 Preview 2)中-不再需要扩展.

Developer Command Prompt and Developer Power Shell are now integrated into Visual Studio 2019 ( 16.2 Preview 2 ) - no need for an extension anymore.

您可以在Tools/Command Line

默认情况下,没有分配快捷方式-因此您必须自己进行操作.

By default no shortcut is assigned - so you have to do this yourself.