Webpack - webpack-dev-server: comando no encontrado

Estoy trabajando en una aplicación web React usando webpack, junto con este tutorial .

Accidentalmente, agregué la carpeta node_modules a mi git. Luego lo quité de nuevo usando git rm -f node_modules/*.

Ahora, cuando intento iniciar el servidor de paquete web, aparece el siguiente error:

> 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

Al principio pensé que era solo mi proyecto, pero luego revisé los puntos de control de código del tutorial: ¡el mismo error! Entonces, algo parece estar mal a nivel mundial.

Esto es lo que intenté hasta ahora:

• rm node_modules y reinstalar con npm install
• npm cache cleancomo alguien mencionó con respecto a este problema en github
• instalar webpack globalmente con npm install -g webpack
• eliminar completamente el nodo y npm de mi sistema (usando esta guía ) y reinstalar usando brew

El mensaje de error aún persiste. ¿Qué más puedo probar?

PD: El contenido de webpack.dev.config.jses:

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;

De acuerdo, fue fácil:

npm install webpack-dev-server -g

Lo que me confundió de que no necesitaba eso al principio, probablemente las cosas cambiaron con una nueva versión.

Para su información, para acceder a cualquier script a través de la línea de comandos como lo intentaba, debe tener el script registrado como shell-script (o cualquier tipo de script como .js, .rb) en el sistema como estos archivos en el directorio /usr/binen UNIX. Y el sistema debe saber dónde encontrarlos. es decir, la ubicación debe cargarse en una $PATHmatriz.

En su caso, el script webpack-dev-serverya está instalado en algún lugar dentro del ./node_modulesdirectorio, pero el sistema no sabe cómo acceder a él. Por lo tanto, para acceder al comando webpack-dev-server, también debe instalar el script en el alcance global .

$ npm install webpack-dev-server -g

Aquí, se -grefiere al alcance global.

Sin embargo, esta no es la forma recomendada porque podría enfrentar problemas de versiones conflictivas; entonces, en su lugar, puede establecer un comando en npmel package.jsonarchivo como:

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

Esta configuración le permitirá acceder al script que desee con un comando simple

$ npm start

Tan corto para memorizar y jugar. Y npmconoce la ubicación del módulo webpack-dev-server.

El script webpack-dev-serverya está instalado dentro del directorio ./node_modules. Puede instalarlo de nuevo globalmente por

sudo npm install -g webpack-dev-server

o ejecutarlo así

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

. significa buscarlo en el directorio actual.

Hilo

Tuve el problema al ejecutar: yarn start

Se solucionó al ejecutar primero: yarn install

Tuve el mismo problema, pero los pasos a continuación me ayudaron a solucionarlo.

1. Instalando el 'webpack-dev-server' localmente (en el directorio del proyecto, ya que no estaba seleccionando de la instalación global)

   npm install --save webpack-dev-server

Puede verificar si la carpeta 'webpack-dev-server' existe dentro de node_modules.

2. Ejecutando usando npx para ejecutar directamente

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

npm run start también funciona bien cuando su entrada en los scripts package.json debería ser como la anterior, como sin npx.

Encontré que la respuesta aceptada no funciona en todos los escenarios. Para asegurarse de que funciona al 100%, TAMBIÉN debe borrar la caché npm. Vaya directamente al caché y borre bloqueos, cachés, anonymous-cli-metrics.json; o se puede intentar npm cache clean.

Dado que el autor había borrado la memoria caché antes de probar la solución recomendada, es posible que no lo hiciera parte de los requisitos previos.

Para instalación global: npm install webpack-dev-server -g

Para la instalación local, npm install --save-dev webpack

Cuando hace referencia al paquete web en el archivo package.json, intenta buscarlo en la ubicación node_modules \ .bin \

Después de la instalación local, el archivo wbpack se creará en la ubicación: \ node_modules \ .bin \ webpack

npm install --save-dev webpack-dev-serverInstalo con luego configuro package.json y webpack.config.js así: configuración .

Luego ejecuto webpack-dev-server y obtengo este error .

Si no lo uso npm install -g webpack-dev-serverpara instalar, ¿cómo solucionarlo?

Solucioné el error configuration has an unknown property 'colors'eliminando colors:true. ¡Funcionó!

Tuve un problema similar con Yarn , ninguno de los anteriores funcionó para mí, así que simplemente eliminé ./node_modulesy ejecuté yarn instally el problema desapareció.

npm install webpack-dev-server -g - sistema operativo Windows

Es mejor usar sudo en linux para evitar errores de permisos

sudo npm instalar webpack-dev-server -g

Puede usar sudo npm install webpack-dev-server --save para agregarlo a package.json.

A veces, es posible que deba ejecutar los siguientes comandos.

npm instala webpack-cli --save o npm instala webpack-cli -g

Noté el mismo problema después de instalar VSCode y agregar un repositorio Git remoto. De alguna manera, la /node_modules/.bincarpeta se eliminó y se ejecutó npm install --save webpack-dev-serveren la línea de comando, reinstaló la carpeta que faltaba y solucionó mi problema.