Webpack - webpack-dev-server: Befehl nicht gefunden


96

Ich arbeite an einer React-Webanwendung mit Webpack, lose neben diesem Tutorial .

Aus Versehen habe ich den Ordner node_modules zu meinem Git hinzugefügt. Ich habe es dann wieder mit entfernt git rm -f node_modules/*.

Wenn ich jetzt versuche, den Webpack-Server zu starten, wird folgende Fehlermeldung angezeigt:

> 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

Zuerst dachte ich, es sei nur mein Projekt, aber dann habe ich die Code-Checkpoints des Tutorials überprüft: der gleiche Fehler! Etwas scheint also global durcheinander zu sein.

Folgendes habe ich bisher versucht:

  • rm node_modules und neu installieren mit npm install
  • npm cache cleanwie jemand zu diesem Thema auf Github erwähnt
  • Installieren Sie das Webpack global mit npm install -g webpack
  • Löschen Sie Node und Npm vollständig von meinem System (mithilfe dieser Anleitung ) und installieren Sie sie mithilfe von Brew neu

Die Fehlermeldung bleibt weiterhin bestehen. Was kann ich noch versuchen?

PS: Der Inhalt von webpack.dev.config.jsist:

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;

Bitte geben Sie den Inhalt der Datei an webpack.dev.config.js.
stdob--

Ich bekomme den gleichen Fehler und Webpack-Dev-Server ist definitiv genau dort im Ordner
Damon

Antworten:


164

Okay, es war einfach:

npm install webpack-dev-server -g

Was mich verwirrte, dass ich das zuerst nicht brauchte, wahrscheinlich änderten sich die Dinge mit einer neuen Version.


30
Aus irgendeinem Grund hat es bei mir ohne -gFlagge nicht funktioniert . Also: npm i webpack-dev-server -gdas Problem gelöst.
Martin Velchevski

2
Ich brauchte auch die -g Flagge
Alex Grande

5
Ich musste auch npm webpack -g installieren, da es zuerst nicht global installiert wurde
TJ Trapp

1
Es war verwirrend, weil sie auf der Webpack-Seite in ihrem Beispiel nicht die Option -g haben. Wenn Sie nicht global installieren möchten, können Sie ein Skript in der Datei package.json erstellen und über npm run ausführen.
kingd9

Ich versuche, dieses Paket mit diesem Befehl "npm deinstallieren webpack-dev-server -g --save" zu deinstallieren, aber nicht deinstalliert. Bitte lassen Sie mich wissen, wie dieses Paket deinstalliert wird.
Bhavin

32

Zu Ihrer Information , um auf ein Skript über die Befehlszeile zuzugreifen, wie Sie es versucht haben, müssen Sie das Skript als Shell-Skript (oder eine beliebige Art von Skript wie .js, .rb) im System wie diese Dateien im Verzeichnis registrieren lassen/usr/bin unter UNIX. Und das System muss wissen, wo sie zu finden sind. dh der Speicherort muss in ein $PATHArray geladen werden .


In Ihrem Fall ist das Skript webpack-dev-serverbereits irgendwo im ./node_modulesVerzeichnis installiert , aber das System weiß nicht, wie es darauf zugreifen soll. Um auf den Befehl zugreifen zu können webpack-dev-server, müssen Sie das Skript auch im globalen Bereich installieren .

$ npm install webpack-dev-server -g

Hier -gbezieht sich auf den globalen Geltungsbereich.


Dies wird jedoch nicht empfohlen, da möglicherweise Probleme mit Versionskonflikten auftreten. Stattdessen können Sie einen Befehl in npmder package.jsonDatei wie folgt festlegen :

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

Mit dieser Einstellung können Sie mit einem einfachen Befehl auf das gewünschte Skript zugreifen

$ npm start

So kurz zum Auswendiglernen und Spielen. Und npmkennt den Standort des Moduls webpack-dev-server.


Aber wenn ich renne node_modules/.bin/webpack-dev-server, warum heißt es dann, dass dies ein ungültiger Befehl ist? Ich denke, Laufen node_modules/.bin/webpack-dev-serverist gleich Laufennpm run dev
Chor

14

Das Skript webpack-dev-serverist bereits im Verzeichnis ./node_modules installiert. Sie können es entweder global erneut installieren, indem Sie

sudo npm install -g webpack-dev-server

oder führen Sie es so aus

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

. bedeutet, es im aktuellen Verzeichnis zu suchen.


8

Garn

Ich hatte das Problem beim Laufen: yarn start

Es wurde behoben, indem zuerst ausgeführt wurde: yarn install


1
Einfach yarn installhat in meinem Fall funktioniert. Ich bin mir nicht sicher, was der Grund war.
Hinrich

1
oder npm iwas auch immer Sie bevorzugen
Akin Hwan

5

Ich hatte das gleiche Problem, aber die folgenden Schritte halfen mir, es zu überwinden.

  1. Lokale Installation des 'Webpack-Dev-Servers' (Im Projektverzeichnis, da es nicht aus der globalen Installation ausgewählt wurde)

    npm install --save webpack-dev-server

Kann überprüfen, ob der Ordner 'webpack-dev-server' in node_modules vorhanden ist.

  1. Laufen mit npx zum direkten Laufen

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

npm run start funktioniert auch gut, wenn Ihr Eintrag in package.json-Skripten wie oben sein sollte, wie ohne npx.


1

Ich habe festgestellt, dass die akzeptierte Antwort nicht in allen Szenarien funktioniert. Um sicherzustellen, dass es zu 100% funktioniert, muss AUCH der npm-Cache geleert werden. Entweder direkt zum Cache gehen und Sperren, Caches, anonym-cli -metrics.json löschen; oder man kann es versuchen npm cache clean.

Da der Autor den Cache geleert hat, bevor er die empfohlene Lösung ausprobiert hat, ist es möglich, dass er nicht zu den Voraussetzungen gehört.


1

Für die globale Installation: npm installiere webpack-dev-server -g

Für die lokale Installation npm install --save-dev webpack

Wenn Sie auf das Webpack in der Datei package.json verweisen, wird versucht, es im Speicherort node_modules \ .bin \ zu suchen

Nach der lokalen Installation wird die Datei wbpack am Speicherort erstellt: \ node_modules \ .bin \ webpack


0

Ich installiere mit npm install --save-dev webpack-dev-serverdann setze ich package.json und webpack.config.js wie folgt: Einstellung .

Dann habe ich webpack-dev-Server ausgeführt werden und diese Fehlermeldung erhalten Fehler .

Wenn ich nicht npm install -g webpack-dev-serverzur Installation verwende, wie kann ich das Problem beheben?

Ich habe den Fehler configuration has an unknown property 'colors'durch Entfernen behoben colors:true. Es funktionierte!


0

Ich hatte ein ähnliches Problem mit Garn , keines der oben genannten hat bei mir funktioniert, also habe ich es einfach entfernt ./node_modulesund bin weggelaufen und das yarn installProblem ist verschwunden.


0

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

Besser Sie verwenden sudo unter Linux, um Berechtigungsfehler zu vermeiden

sudo npm installiere webpack-dev-server -g

Sie können sudo npm install webpack-dev-server --save verwenden, um es zu package.json hinzuzufügen.

Manchmal müssen Sie möglicherweise die folgenden Befehle ausführen.

npm install webpack-cli --save oder npm install webpack-cli -g


Bitte raten Sie nicht, sudo mit npm zu verwenden.
richardsonwtr

Sehen Sie warum hier
richardsonwtr

0

Ich habe das gleiche Problem festgestellt, nachdem ich VSCode installiert und ein Remote-Git-Repository hinzugefügt habe. Irgendwie wurde der /node_modules/.binOrdner gelöscht und npm install --save webpack-dev-serverin der Befehlszeile ausgeführt. Der fehlende Ordner wurde erneut installiert und mein Problem behoben.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.