npmでローカルインストールしたnode_modulesにパスが通らない

解決済

回答 2

投稿

  • 評価
  • クリップ 1
  • VIEW 1,776

hrck19

score 11

問題の背景

・元々node.js v8.9がインストールされていましたが、(npmのバージョンは忘れました)
グローバルインストールしているnode_modulesをきれいにしたいこと、そしてnode.js自体のバージョンを上げたいことからアンインストール→再度新規でインストールを行いました。(やり方がまずかったことは承知しておりますので一旦無視してください)

・アンインストールの際は以下を実施しました。
1.「プログラムと機能」からNode.jsをアンインストールする。
2.下記フォルダを手動で削除する 
%USERPROFILE%\AppData\Roaming\npm 
%USERPROFILE%\AppData\Roaming\npm-cache

質問内容

題名の通り再度インストールしたnpmでローカルインストールしたnode_modulesにパスが通りません。
かつてのバージョンであればローカルインストールしたものはパスが通っていたと記憶しております。
環境変数の設定が漏れているのだと思いますが、何を追加すればいいかわかりません。
もしくは再インストールなど別の方法での問題解決でも構いません。

ご教示お願い致します。

発生している問題・エラーメッセージ

C直下のTempにてAngular-CLIをローカルインストールし、
ngコマンド実行時のエラーです。
再インストール前はnpm install後、なんの設定もなくngコマンドが実行できていたと記憶しています。

C:\Temp>npm install @angular/cli
npm WARN saveError ENOENT: no such file or directory, open 'C:\Temp\package.json'
npm WARN enoent ENOENT: no such file or directory, open 'C:\Temp\package.json'
npm WARN Temp No description
npm WARN Temp No repository field.
npm WARN Temp No README data
npm WARN Temp No license field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ @angular/cli@7.2.0
added 93 packages from 84 contributors in 21.409s

C:\Temp>ng -v
'ng' は、内部コマンドまたは外部コマンド、
操作可能なプログラムまたはバッチ ファイルとして認識されていません。

確認したこと

ひとまず以下は確認しました。

$ npm bin 
C:\Temp\node_modules\.bin
$ npm bin -g
C:\Users\%UserName%\AppData\Roaming\npm

node.js関連の環境変数
NODE_PATH=C:\Users\%UserName%\AppData\Roaming\npm\node_modules

補足情報(FW/ツールのバージョンなど)

現在使用しているマシン及び各プログラムのバージョンは以下の通りです。
OS:Windows10 64bit
node.js:v10.15.0
npm : 6.4.1

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

checkベストアンサー

+1

もともとローカルの node_modules/.bin には npm-scripts を経由しなければパス通らない仕様ですよ。
おそらく以前はグローバルインストールしていたのだと思います。

また Scaffold を用意するツールなどは、プロジェクトがそれ自体に依存していないのならグローバルインストールするべきです。
どうしてもグローバルインストールしたくなかったりお試ししたい場合は npx コマンド使うのもありです。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

+1

OSでコマンドを使うという行為は、
環境変数のPATHという文字列を参照して;等の区切り文字でぶった切りディレクトリ名の配列を取り出します。
先頭(左)から順番にディレクトリ内へアクセスしてコマンド名と同様の実行ファイルを探していき、
実行ファイルが見つかれば実行、なければ「そんなコマンドありませんよ」というエラーを返すというものです。

Windowsの場合はファイル名そのものの他にも.lnkや.exeなどの拡張子付きのファイルも実行したりしなかったりします。
というわけで、結論から言えばグローバルオプション-gをつければパスの通ったディレクトリに実行ファイルがコピーされるはずで、それを元に実行します。

C:\Temp>npm install -g @angular/cli

npmに於けるローカルインストールというのはローカルマシンではなく、
カレントプロジェクト、もしくはカレントディレクトリを指します。

つまりコマンド打ち込んだディレクトリ内でnode_modulesディレクトリを作ってその中にnpmから落としてきたモジュールを投げ込む作業ですよ。
パスが通ってないところにインストールしてコマンドが使えるわけないじゃないですか。


npm run xxxという風にnpm-scripts越しに実行された場合、
PATH文字列の先頭だか末尾だかにpackage.jsonのあるディレクトリ/node_modules/binみたいなパスが付与されます。

-Dオプション付きでインストールすると、実行ファイルが存在するモジュールの場合、このディレクトリ内に実行ファイルを設置してくれます。
こういう経緯があるのでローカルインストールしているのにnpm-scrips越しだとあたかも普通のコマンドの様に認識してくれるのです。
gulpやwebpackなんかは-Dの開発者用オプションを使ってインストールする癖をつけてください。

ただし、今回やりたいのはangularのcliのようですので-gオプションが適切でしょうね。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.22%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる