mac install webpack -bash: webpack: コマンドが見つかりませんでした。

<スパン 1. npmでインストールするには、まずnode.jsをインストールする必要があります。  https://nodejs.org/en/download/ ダウンロードとインストール 

Node.jsとnpmのインストール

ファイルをダブルクリックして、無心に次のステップに進むだけです。インストールに成功すると、このようになります。

2、インストールが成功したかどうかを確認するためにインストールした後、バージョンを見て、端末を開き、入力：ノード-v [ビューノードバージョン]、npm -v [ビューnpmバージョン]を。 

4. webpackのグローバルインストール

方法1：ターミナルに sudo -s と入力し、ブートパスワードを入力し、実行します。

npm install webpack-cli -g 

方法2

(macでのインストールにはsudo権限が必要です。）

xxxx-Pro:demo1 xf$ sudo npm install webpack-cli -g
パスワード
/usr/local/bin/webpack-cli -> /usr/local/lib/node_modules/webpack-cli/bin/cli.js
npm WARN [email protected] requires a peer of webpack@^4.x.x but none is installed. ピアの依存関係は自分でインストールする必要があります。
+ [email protected]

49 名の貢献者による 105 個のパッケージの追加 (14.398 秒)

注意: インストールは成功しましたが、コマンドラインで webpack -v と入力すると、次のようなエラーが表示されます。

-bash:webpack:command not found 

このサイトでは、いくつかの解決策を探しましたが、どれもうまくいきませんでした。最終的にnodeのパッケージを管理するためにnvmを使うことにしました。初心者はパッケージのインストールでnodeをインストールしていたため、多くの環境パスを設定する必要がありました。

Nvmのインストール

<スパン 1. インストールパッケージのノードをアンインストールして、node_modules

• グローバルにインストールされているnode/npmをアンインストールします。

  公式サイトからダウンロードしたnodeインストーラは、グローバルディレクトリに自動的にインストールされます。nodeコマンドは/usr/local/bin/nodeに、npmコマンドはグローバルディレクトリのnode_modules /usr/local/lib/node_modules/npmにあります。

• nvmをインストールする前に、インストールされているnodeモジュールとglobal nodeモジュールを削除するのは良いアイデアです。

npm ls -g --depth=0 # See what modules are already installed globally, so you can remove them and reinstall them globally with a different node version
sudo rm -rf /usr/local/lib/node_modules # Delete the global node_modules directory
sudo rm /usr/local/bin/node # Delete node
cd /usr/local/bin && ls -l | grep ". /lib/node_modules/" | awk '{print $9}'| xargs rm # Remove softlinks from global node module registration

2. githubのnvmにアクセスし、コマンドラインを取得します。

クリックするとリンクが開きます

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash

xxxxxx-Pro:bin xf$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash

  合計 % 受信 % Xferd 平均速度 時刻 時刻現在

                                 Dload Upload Total Spent 左速度

100 12819 100 12819 0 0 0 13977 0 --:--:-- ---:--:--:--:--:--:-- 13964

=> gitからnvmを「/Users/xf/.nvm」にダウンロード中。

=> '/Users/xf/.nvm'にクローンを作成する...

リモート オブジェクトのカウント: 267、完了しました。

リモートで オブジェクトを圧縮しています。100% (242/242)、完了。

リモート 合計267（デルタ31）、再利用86（デルタ15）、パック再利用0

オブジェクトを受信しています。100% (267/267), 119.47 KiB | 47.00 KiB/s, 完了しました。

デルタを解決する。100%(31/31)、完了しました。

=> git リポジトリの圧縮とクリーンアップ

=> /Users/xf/.bash_profileにnvmのソース文字列を追加する。

=> bash_completion のソース文字列を /Users/xf/.bash_profile に追記する。

=> nvmを使い始めるにはターミナルを閉じて開き直すか、今すぐ使うには以下を実行します。

export NVM_DIR="$HOME/.nvm"

[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # これは nvm をロードします。

[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # これは nvm bash_completion を読み込みます。

nvm 自体が環境変数に追加してくれます（Mac の場合）。以下のコマンドで確認できます。

vim ~/.bash_profile

しかし、この時点ではまだコマンドは完全に有効ではないので、次のように実行する必要があります。

ソース ~/.bash_profile

webpackのグローバルインストール

xxxx-Pro:~ xf$ npm install webpack -g

SUCCESSがある場合は、インストールに成功したことを示します。

/Users/xf/.nvm/versions/node/v10.4.1/bin/webpack -> /Users/xf/.nvm/versions/node/v10.4.1/lib/node_modules/webpack/bin/webpack.js

> [email protected] install /Users/xf/.nvm/versions/node/v10.4.1/lib/node_modules/webpack/node_modules/fsevents

nodeのインストール

[fsevents] 成功: "/Users/xf/.nvm/versions/node/v10.4.1/lib/node_modules/webpack/node_modules/fsevents/lib/binding/Release/node-v64-darwin-x64/fse.node" 既にインストールされています。

再インストールするには --update-binary を、再コンパイルするには --build-from-source を渡してください。

<スパン + [email protected]

299 名の貢献者による 389 個のパッケージの追加 (58.518 秒)

コマンドラインで webpack -v と入力すると、バージョン番号が表示され、インストールに成功したことを示します。

xxxx-Pro:~ xf$ webpack -v

4.12.0