web-dev-qa-db-ja.com

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

私は、Webpackを使ってReact Webアプリケーションを大まかに一緒に作業しています このチュートリアル 。

誤って、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! [email protected] 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 cleangithubに関するこの号
  • npm install -g webpackを使ってwebpackをグローバルにインストールします
  • 私のシステムからnodeとnpmを完全に削除し（ このガイド を使って）、brewを使って再インストールします

エラーメッセージはまだ持続します。他に何を試すことができますか？

シモンズ：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;
node.jsnpmwebpack
81
moejoe

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

npm install webpack-dev-server -g

私が最初はそれを必要としていなかったことを私を混乱させた、おそらく物事は新しいバージョンで変更されました。

139
moejoe

参考までに、あなたが試していたようにコマンドラインからスクリプトにアクセスするには、そのスクリプトをシェルスクリプトとして登録する必要があります（または.js、.rbのような種類のスクリプト）UNIXのdir /usr/binにあるこれらのファイルのようなシステムで。そして、システムはそれらを見つける場所を知っていなければなりません。つまり、場所は$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の位置を知っています。

21
illusionist

スクリプト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

.は現在のディレクトリでそれを見ることを意味します。

12
fangxing

糸

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

最初の実行で修正されました：yarn install

6
pme

私は同じ問題を抱えていたが、以下のステップは私がそれから抜け出すのを助けた。

  1. 'webpack-dev-server'をローカルにインストールする（グローバルインストールから選択していなかったのでプロジェクトディレクトリに）

    npm install --save webpack-dev-server

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

  1. 直接実行するためにnpxを使用して実行する

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

npm run startは、package.jsonスクリプトのエントリがnpxなしの場合のように上記のようになっている場合にも正常に機能します。

3
RajaSekhar K

私はYarnと同じような問題を抱えていました、上記のどれも私のために働きませんでした、それで私は単に./node_modulesを削除してyarn installを実行して問題はなくなりました。

0
ulou

私は、受け入れられた答えがすべてのシナリオでうまくいくとは限らないことを見つけました。確実に100％動作させるには、npmキャッシュをクリアする必要があります。直接キャッシュに移動してロック、キャッシュ、anonymous-cli-metrics.jsonをクリアします。あるいはnpm cache cleanを試すこともできます。

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

0
user458617

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

0
Sreenivasula Reddy

の問題について

通常のGlobalオプションの代わりにwebpackをローカルで実行する方法

を見てみましょう

https://stackoverflow.com/a/51165867/10003436

0
peacemaker

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

それから私はwebpack-dev-serverを実行してこのエラーを取得します エラー 。

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

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

0
user7587906