さんごーの節約&ダイエット日記。

楽しく節約とダイエット!をしながら日々の学んだ事をまとめていく個人ブログです。

VisualStudio2017でnpmインストールする方法のメモ

VisualStudio2017を使ってnode.jsの学習をしていこうと思い立ち、いろいろ触っています。

空のnode.jsプロジェクトを作って、あとからexpress等のモジュールを追加して使いたい時に「VisualStudio上でnpm installはどうやるんだろこれ」と思って調べたのでメモを残しておきます。

 

 

空のnode.jsアプリケーションのプロジェクトを作ったとする

f:id:thirtyfive:20170612221433p:plain

 

方法1.npmパッケージを選択してインストールする場合

ソリューションエクスプローラの「npm」を右クリックしてコンテキストメニューを出し、「新しいnpmパッケージのインストール」を選択する。

f:id:thirtyfive:20170612221730p:plain

 

npmパッケージの検索ダイアログが出るので、そこでほしいパッケージを検索し、検索結果からインストールしたいパッケージを選択し、インストールボタンを押して完了。

f:id:thirtyfive:20170612222447p:plain

 

パッケージが追加されました。

f:id:thirtyfive:20170612222721p:plain

 

package.jsonにも自動的に追加されています。

f:id:thirtyfive:20170612222925p:plain

 

方法2.package.jsonの内容を元にnpm installする場合

通常はコマンドラインで行う処理だと思いますが、せっかくVisulaStudioを使っているのでVisualStudio上でできたほうが便利だと思います。もちろんできます。

 

package.jsonに追加したいパッケージの情報を記述します。

f:id:thirtyfive:20170612223317p:plain

 

package.jsonの変更を保存すると、ソリューションエクスプローラのnpmの下に「パッケージ名(欠落)」という項目が追加されます。

f:id:thirtyfive:20170612223504p:plain

 

ソリューションエクスプローラの「npm」を右クリックしてコンテキストメニューを表示させ、「欠落しているnpmパッケージをインストール」を選択します。

f:id:thirtyfive:20170612223627p:plain

 

npm installが実行され、npmパッケージがインストールされました。

f:id:thirtyfive:20170612223914p:plain

 

 

簡単なメモですが以上です。