Webpack - webpack-dev-server: comando não encontrado

Estou trabalhando em um webapp React usando webpack, vagamente ao lado deste tutorial .

Acidentalmente, adicionei a pasta node_modules ao meu git. Em seguida, removi novamente usando git rm -f node_modules/*.

Agora, quando tento iniciar o servidor webpack, recebo o seguinte erro:

> 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

A princípio pensei que era apenas meu projeto, mas depois verifiquei os pontos de verificação do código do tutorial: mesmo erro! Portanto, algo parece estar confuso globalmente.

Aqui está o que tentei até agora:

• rm node_modules e reinstalar com npm install
• npm cache cleancomo alguém mencionou em relação a este problema no github
• instale o webpack globalmente com npm install -g webpack
• exclua completamente o nó e o npm do meu sistema (usando este guia ) e reinstale usando o brew

A mensagem de erro ainda persiste. O que mais posso tentar?

PS: O conteúdo de 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;

Ok, foi fácil:

npm install webpack-dev-server -g

O que me confundiu eu não precisar disso no início, provavelmente as coisas mudaram com uma nova versão.

Para sua informação, para acessar qualquer script via linha de comando como você estava tentando, você precisa ter o script registrado como um shell-script (ou qualquer tipo de script como .js, .rb) no sistema como esses arquivos no diretório /usr/binno UNIX. E o sistema deve saber onde encontrá-los. ou seja, o local deve ser carregado na $PATHmatriz.

No seu caso, o script webpack-dev-serverjá está instalado em algum lugar dentro do ./node_modulesdiretório, mas o sistema não sabe como acessá-lo. Portanto, para acessar o comando webpack-dev-server, é necessário instalar o script em escopo global também.

$ npm install webpack-dev-server -g

Aqui, -grefere-se ao escopo global.

No entanto, essa forma não é recomendada porque você pode enfrentar problemas de conflito de versão; por isso, em vez disso você pode definir um comando em npm's package.jsonarquivo como:

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

Esta configuração permitirá que você acesse o script que deseja com um comando simples

$ npm start

Tão curto para memorizar e jogar. E npmsabe a localização do módulo webpack-dev-server.

O script webpack-dev-serverjá está instalado no diretório ./node_modules. Você pode instalá-lo novamente globalmente por

sudo npm install -g webpack-dev-server

ou correr assim

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

. significa procurar no diretório atual.

Fio

Tive o problema ao executar: yarn start

Foi corrigido executando primeiro: yarn install

Eu tive o mesmo problema, mas as etapas abaixo me ajudaram a sair dele.

1. Instalando o 'webpack-dev-server' localmente (no diretório do projeto, pois não foi selecionado na instalação global)

   npm install --save webpack-dev-server

Pode verificar se a pasta 'webpack-dev-server' existe dentro de node_modules.

2. Executando usando npx para executar diretamente

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

npm run start também funciona bem onde sua entrada em scripts package.json deve ser como o acima, sem npx.

Descobri que a resposta aceita não funciona em todos os cenários. Para garantir que 100% funcione, também é necessário limpar o cache npm. Vá diretamente para o cache e limpe os bloqueios, caches, anonymous-cli-metrics.json; ou pode-se tentar npm cache clean.

Como o autor limpou o cache antes de tentar a solução recomendada, é possível que não tenha feito parte dos pré-requisitos.

Para instalação global: npm install webpack-dev-server -g

Para instalação local npm install --save-dev webpack

Quando você se refere ao webpack no arquivo package.json, ele tenta procurá-lo no local node_modules \ .bin \

Após a instalação local, o arquivo wbpack será criado no local: \ node_modules \ .bin \ webpack

Eu instalo com npm install --save-dev webpack-dev-serverentão defino package.json e webpack.config.js assim: configuração .

Então eu executo webpack-dev-server e recebo este erro de erro .

Se eu não costumo npm install -g webpack-dev-serverinstalar, como consertar?

Corrigi o erro configuration has an unknown property 'colors'removendo colors:true. Funcionou!

Tive um problema semelhante com o Yarn , nenhum dos anteriores funcionou para mim, então simplesmente removi ./node_modulese corri yarn installe o problema foi embora.

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

Melhor você usar o sudo no linux para evitar erros de permissão

sudo npm install webpack-dev-server -g

Você pode usar sudo npm install webpack-dev-server --save para adicioná-lo ao package.json.

Às vezes, pode ser necessário executar os comandos abaixo.

npm install webpack-cli --save ou npm install webpack-cli -g

Percebi o mesmo problema depois de instalar o VSCode e adicionar um repositório Git remoto. De alguma forma, a /node_modules/.binpasta foi excluída e rodando npm install --save webpack-dev-serverna linha de comando, reinstalou a pasta ausente e corrigiu meu problema.