Webpack - webpack-dev-server: nie znaleziono polecenia

97

Pracuję nad aplikacją internetową React przy użyciu pakietu internetowego, luźno obok tego samouczka .

Przypadkowo dodałem folder node_modules do mojego git. Następnie usunąłem go ponownie za pomocą git rm -f node_modules/*.

Teraz, kiedy próbuję uruchomić serwer webpacka, pojawia się następujący błąd:

> 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

Na początku myślałem, że to tylko mój projekt, ale potem sprawdziłem punkty kontrolne kodu w samouczku: ten sam błąd! Wydaje się więc, że na całym świecie coś jest nie tak.

Oto, czego próbowałem do tej pory:

  • rm node_modules i zainstaluj ponownie za pomocą npm install
  • npm cache cleanjak ktoś wspomniał o tym problemie na githubie
  • zainstaluj pakiet webpack globalnie z npm install -g webpack
  • całkowicie usuń node i npm z mojego systemu (korzystając z tego przewodnika ) i zainstaluj ponownie używając brew

Komunikat o błędzie nadal występuje. Czego jeszcze mogę spróbować?

PS: Treść webpack.dev.config.jsto:

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;
Jonas Kemper
źródło
Proszę podać zawartość pliku webpack.dev.config.js.
stdob
Otrzymuję ten sam błąd i serwer webpack-dev-server jest zdecydowanie w folderze
Damon

Odpowiedzi:

165

Dobra, to było łatwe:

npm install webpack-dev-server -g

Co mnie zmyliło, że na początku tego nie potrzebowałem, prawdopodobnie coś się zmieniło wraz z nową wersją.

Jonas Kemper
źródło
30
Z jakiegoś powodu to nie zadziałało bez -gflagi. A więc: npm i webpack-dev-server -grozwiązałem problem.
Martin Velchevski
2
Ja też potrzebowałem flagi -g
Alex Grande
5
Musiałem też zainstalować npm webpack -g, ponieważ początkowo nie był on instalowany globalnie
TJ Trapp
1
Było to mylące, ponieważ na stronie z pakietem internetowym nie ma opcji -g w swoim przykładzie. Jeśli nie chcesz instalować globalnie, możesz utworzyć skrypt w pliku package.json i uruchomić go za pomocą polecenia npm run.
kingd9
próbuję odinstalować ten pakiet za pomocą polecenia „npm uninstall webpack-dev-server -g --save”, ale nie odinstalowałem, proszę o informację, jak odinstalować ten pakiet.
Bhavin
32

FYI, aby uzyskać dostęp do dowolnego skryptu za pomocą wiersza poleceń, tak jak próbowałeś, musisz zarejestrować skrypt jako skrypt powłoki (lub dowolny rodzaj skryptu, taki jak .js, .rb) w systemie, taki jak te pliki w katalogu /usr/binw systemie UNIX. A system musi wiedzieć, gdzie je znaleźć. tj. lokalizacja musi być załadowana do $PATHtablicy.


W twoim przypadku skrypt webpack-dev-serverjest już zainstalowany gdzieś w ./node_moduleskatalogu, ale system nie wie, jak uzyskać do niego dostęp. Tak więc, aby uzyskać dostęp do polecenia webpack-dev-server, musisz również zainstalować skrypt w zakresie globalnym .

$ npm install webpack-dev-server -g

Tutaj -godnosi się do zakresu globalnego.


Nie jest to jednak zalecany sposób, ponieważ możesz napotkać problemy powodujące konflikty wersji; Tak więc, zamiast można ustawić polecenie npm„s package.jsonpliku, takich jak:

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

To ustawienie umożliwia dostęp do żądanego skryptu za pomocą prostego polecenia

$ npm start

Tak krótki, aby zapamiętać i grać. I npmzna lokalizację modułu webpack-dev-server.

iluzjonista
źródło
Ale kiedy biegnę node_modules/.bin/webpack-dev-server?, Dlaczego mówi się, że jest to nieprawidłowe polecenie myślę uruchomiony node_modules/.bin/webpack-dev-serverjest równa działanpm run dev
Chor
15

Skrypt webpack-dev-serverjest już zainstalowany w katalogu ./node_modules. Możesz zainstalować go ponownie globalnie przez

sudo npm install -g webpack-dev-server

lub uruchom to w ten sposób

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

. oznacza, że ​​szukaj go w bieżącym katalogu.

fangxing
źródło
8

Przędza

Miałem problem podczas biegania: yarn start

Naprawiono to, uruchamiając najpierw: yarn install

pme
źródło
1
Prosty yarn installdziałał w moim przypadku. Nie wiem, jaki był powód.
Hinrich
1
lub npm icokolwiek wolisz
Akin Hwan
5

Miałem ten sam problem, ale poniższe kroki pomogły mi się z tego wydostać.

  1. Lokalna instalacja serwera „webpack-dev-server” (w katalogu projektu, ponieważ nie był on pobierany z instalacji globalnej)

    npm install --save webpack-dev-server

Potrafi sprawdzić, czy folder „webpack-dev-server” istnieje w module node_modules.

  1. Uruchamianie przy użyciu npx do bezpośredniego uruchamiania

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

npm run start działa również dobrze, gdy twój wpis w skryptach package.json powinien być taki jak powyżej, jak bez npx.

RajaSekhar K
źródło
1

Zauważyłem, że zaakceptowana odpowiedź nie działa we wszystkich scenariuszach. Aby upewnić się, że działa w 100%, należy TAKŻE wyczyścić pamięć podręczną npm. Albo bezpośrednio Przejdź do pamięci podręcznej i wyczyść blokady, pamięci podręczne, anonymous-cli-metrics.json; lub można spróbowaćnpm cache clean .

Ponieważ autor wyczyścił pamięć podręczną przed wypróbowaniem zalecanego rozwiązania, możliwe, że nie udało się uczynić go częścią wymagań wstępnych.

user458617
źródło
1

W przypadku instalacji globalnej: npm install webpack-dev-server -g

W przypadku instalacji lokalnej npm install --save-dev webpack

Kiedy odwołujesz się do pakietu webpack w pliku package.json, próbuje on znaleźć go w lokalizacji node_modules \ .bin \

Po instalacji lokalnej plik wbpack zostanie utworzony w lokalizacji: \ node_modules \ .bin \ webpack

S_K
źródło
1

Zauważyłem ten sam problem po zainstalowaniu VSCode i dodaniu zdalnego repozytorium Git. W jakiś sposób /node_modules/.binfolder został usunięty i uruchomiony npm install --save webpack-dev-serverw wierszu poleceń, ponownie zainstalowałem brakujący folder i naprawiłem mój problem.

Goz E.
źródło
0

Instaluję z, npm install --save-dev webpack-dev-servera następnie ustawiam package.json i webpack.config.js w ten sposób: ustawienie .

Następnie uruchamiam webpack-dev-server i otrzymuję ten błąd .

Jeśli nie używam npm install -g webpack-dev-server do instalacji, to jak to naprawić?

Naprawiłem błąd configuration has an unknown property 'colors', usuwając colors:true. Zadziałało!

user7587906
źródło
0

Miałem podobny problem z włóczką , żadna z powyższych nie działała dla mnie, więc po prostu usunąłem ./node_modulesi uruchomiłem yarn installi problem zniknął.

ulou
źródło
0

npm install webpack-dev-server -g - system operacyjny Windows

Lepiej używaj sudo w Linuksie, aby uniknąć błędów uprawnień

sudo npm zainstaluj pakiet webpack-dev-server -g

Możesz użyć sudo npm install webpack-dev-server --save, aby dodać go do package.json.

Czasami może być konieczne uruchomienie poniższych poleceń.

npm install webpack-cli --save lub npm install webpack-cli -g

Sreenivasula Reddy
źródło
Nie radzimy używać sudo z npm.
richardsonwtr
Zobacz, dlaczego tutaj
richardsonwtr