[node.js] Webpack-webpack-dev-server : 명령을 찾을 수 없습니다.

이 튜토리얼 과 함께 webpack을 사용하여 React webapp에서 작업하고 있습니다 .

실수로 내 자식에 node_modules 폴더를 추가했습니다. 그런 다음을 사용하여 다시 제거했습니다 git rm -f node_modules/*.

이제 웹팩 서버를 시작하려고하면 다음 오류가 발생합니다.

> 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

처음에는 내 프로젝트 일 뿐이라고 생각했지만 튜토리얼의 코드 체크 포인트를 확인했습니다. 같은 오류입니다! 그래서 무언가가 전 세계적으로 엉망인 것 같습니다.

지금까지 시도한 내용은 다음과 같습니다.

  • rm node_modules 및 다시 설치 npm install
  • npm cache clean누군가 가 github 에서이 문제에 대해 언급했듯이
  • 전역 적으로 웹팩 설치 npm install -g webpack
  • 내 시스템에서 노드와 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;



답변

좋습니다. 쉬웠습니다.

npm install webpack-dev-server -g

처음에는 필요하지 않았다는 점을 혼란스럽게했으며 아마도 새 버전으로 인해 상황이 변경되었을 것입니다.


답변

참고로, 시도한 것처럼 명령 줄을 통해 스크립트에 액세스 하려면 dir에있는 이러한 파일과 같은 시스템에서 스크립트를 쉘 스크립트 (또는 .js, .rb와 같은 모든 종류의 스크립트) 로 등록해야합니다.
/usr/binUNIX에서. 그리고 시스템은 그것들을 찾을 수있는 위치를 알아야합니다. 즉, 위치는 $PATH배열에 로드되어야합니다 .


귀하의 경우 스크립트 webpack-dev-server는 이미 ./node_modules디렉토리 내부 어딘가에 설치되어 있지만 시스템은 액세스 방법을 모릅니다. 따라서 명령에 액세스하려면 전역 범위 에서도 webpack-dev-server스크립트를 설치해야합니다 .

$ npm install webpack-dev-server -g

여기서는 -g전역 범위를 나타냅니다.


그러나 버전 충돌 문제에 직면 할 수 있으므로 권장되지 않습니다. 따라서 대신 다음 과 같이 npmpackage.json파일에 명령을 설정할 수 있습니다 .

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

이 설정을 사용하면 간단한 명령으로 원하는 스크립트에 액세스 할 수 있습니다.

$ npm start

기억하고 놀기에는 너무 짧습니다. 그리고 npm모듈의 위치를 ​​알고 webpack-dev-server있습니다.


답변

스크립트 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

. 현재 디렉토리에서 본다는 뜻입니다.


답변

실행할 때 문제가 발생했습니다. yarn start

먼저 실행하여 수정되었습니다. yarn install


답변

나는 같은 문제가 있었지만 아래 단계는 내가 그것을 벗어나는 데 도움이되었습니다.

  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없이 위와 같아야하는 곳에서도 잘 작동합니다.


답변

수락 된 답변이 모든 시나리오에서 작동하지 않는다는 것을 알았습니다. 100 % 작동하는지 확인하려면 npm 캐시도 지워야합니다. 캐시로 직접 이동하여 잠금, 캐시, anonymous-cli-metrics.json을 지우십시오. 또는 시도 할 수 있습니다 npm cache clean.

저자가 권장 솔루션을 시도하기 전에 캐시를 지 웠기 때문에 전제 조건의 일부로 만들지 못했습니다.


답변

전역 설치의 경우 :
npm install webpack-dev-server -g

로컬 설치의 경우
npm install –save-dev webpack

package.json 파일에서 webpack을 참조하면 node_modules \ .bin \ 위치에서 조회를 시도합니다.

로컬 설치 후 wbpack 파일이 \ node_modules \ .bin \ webpack 위치에 생성됩니다.