Webpack-webpack-dev-server：コマンドが見つかりません

このチュートリアルと一緒に、大まかにwebpackを使用してReact webappに取り組んでいます。

誤って、node_modulesフォルダーをgitに追加しました。次に、を使用してもう一度削除しましたgit rm -f node_modules/*。

ここで、webpackサーバーを起動しようとすると、次のエラーが発生します。

> webpack-dev-server -d --config webpack.dev.config.js --content-base public/ --progress --colors

sh: webpack-dev-server: command not found

npm ERR! Darwin 14.4.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "devserve"
npm ERR! node v0.12.4
npm ERR! npm  v2.10.1
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! Blabber@0.0.1 devserve: `webpack-dev-server -d --config webpack.dev.config.js --content-base public/ --progress --colors`
npm ERR! spawn ENOENT

最初は自分のプロジェクトだと思っていましたが、チュートリアルのコードチェックポイントをチェックアウトしました。同じエラーです！したがって、何かがグローバルにめちゃくちゃになっているようです。

これが私がこれまでに試したことです：

• rm node_modules そして再インストール npm install
• npm cache clean誰かがgithubでこの問題について述べたように
• でグローバルにwebpackをインストールする npm install -g webpack
• システムからノー​​ドとnpmを完全に削除し（このガイドを使用）、brewを使用して再インストールします

エラーメッセージは引き続き表示されます。他に何を試すことができますか？

PS：の内容webpack.dev.config.jsは次のとおりです。

var config = require('./webpack.config.js');
var webpack = require('webpack');

config.plugins.push(
  new webpack.DefinePlugin({
    "process.env": {
      "NODE_ENV": JSON.stringify("development")
    }
  })
);

module.exports = config;

さて、それは簡単でした：

npm install webpack-dev-server -g

最初はそれを必要としなかったと私を混乱させたのは、おそらく新しいバージョンで状況が変わったからです。

参考までに、コマンドラインを介してスクリプトにアクセスするには、ディレクトリ内のこれらのファイルのように、スクリプトをシステムにシェルスクリプト（または.js、.rbなどの種類のスクリプト）として登録する必要があります。 /usr/binUNIX。そして、システムはそれらを見つける場所を知っている必要があります。つまり、場所を$PATH配列にロードする必要があります。

あなたの場合、スクリプトwebpack-dev-serverはすでに./node_modulesディレクトリ内のどこかにインストールされていますが、システムはそれにアクセスする方法を知りません。したがって、コマンドにアクセスwebpack-dev-serverするには、スクリプトをグローバルスコープにもインストールする必要があります。

$ npm install webpack-dev-server -g

ここで-gは、グローバルスコープを指します。

ただし、バージョンの競合の問題に直面する可能性があるため、この方法はお勧めできません。したがって、代わりに次のようにコマンドをnpmのpackage.jsonファイルに設定できます。

  "scripts": {
    "start": "webpack-dev-server -d --config webpack.dev.config.js --content-base public/ --progress --colors"
   }

この設定により、簡単なコマンドで必要なスクリプトにアクセスできます

$ npm start

覚えて遊ぶのにとても短い。そして、npmモジュールの場所を知っていますwebpack-dev-server。

スクリプトwebpack-dev-serverはすでに./node_modulesディレクトリ内にインストールされています。グローバルに再インストールすることもできます

sudo npm install -g webpack-dev-server

またはこのように実行します

./node_modules/webpack-dev-server/bin/webpack-dev-server.js -d --config webpack.dev.config.js --content-base public/ --progress --colors

. 現在のディレクトリを確認することを意味します。

糸

実行中に問題が発生しました： yarn start

最初に実行することで修正されました： yarn install

私は同じ問題を抱えていましたが、以下の手順で問題を解決することができました。

1. 「webpack-dev-server」をローカルにインストールします（グローバルインストールから選択していないため、プロジェクトディレクトリにあります）

   npm install --save webpack-dev-server

node_modules内に「webpack-dev-server」フォルダーが存在するかどうかを確認できます。

2. 直接実行するためのnpxを使用した実行

npx webpack-dev-server --mode development --config ./webpack.dev.js

npm run start また、package.jsonスクリプトのエントリが上記のようにnpxがない場合と同様に機能する場合も問題なく機能します。

承認された回答がすべてのシナリオで機能するわけではないことがわかりました。100％動作させるには、npmキャッシュもクリアする必要があります。直接キャッシュに移動して、ロック、キャッシュ、anonymous-cli-metrics.jsonをクリアします。または1つ試すことができnpm cache cleanます。

作者は推奨される解決策を試す前にキャッシュをクリアしていたため、それを前提条件の一部にすることができなかった可能性があります。

グローバルインストールの場合： npm install webpack-dev-server -g

ローカルインストールの場合 npm install --save-dev webpack

package.jsonファイルでwebpackを参照すると、node_modules \ .bin \の場所を調べようとします

ローカルインストール後、ファイルwbpackは次の場所に作成されます：\ node_modules \ .bin \ webpack

npm install --save-dev webpack-dev-server次に、package.jsonとwebpack.config.jsを次のように設定して インストールします。。

次に、webpack-dev-serverを実行して、このエラーエラーが発生し ます。

npm install -g webpack-dev-serverインストールに使用しない場合、それを修正するにはどうすればよいですか？

をconfiguration has an unknown property 'colors'削除してエラーを修正しましたcolors:true。出来た！

Yarnにも同様の問題があり、上記のいずれもうまくいかなかったので、単に削除./node_modulesして実行するyarn installと問題は解決しました。

npm install webpack-dev-server -g-Windows OS

許可エラーを回避するためにLinuxでsudoを使用する方が良い

sudo npm install webpack-dev-server -g

sudo npm install webpack-dev-server --saveを使用して、package.jsonに追加できます。

以下のコマンドを実行する必要がある場合があります。

npm install webpack-cli --saveまたはnpm install webpack-cli -g

VSCodeをインストールしてリモートGitリポジトリを追加した後も、同じ問題に気付きました。どういうわけか、/node_modules/.binフォルダーが削除さnpm install --save webpack-dev-serverれ、コマンドラインで実行すると、不足しているフォルダーが再インストールされ、問題が解決しました。