webpack은 내부 또는 외부 명령, 작동 가능한 프로그램 또는 배치 파일로 인식되지 않습니다.

저는 React.js를 배우고 있으며 Windows 8 OS를 사용하고 있습니다. 내 루트 폴더로 이동했습니다.

1.Created the package.json file by npm init
2. install webpack by npm install -S webpack.now webpack has been downloaded to my modules folder
3. install webpack globally by typing npm install webpack -g
4. i am also having a webpack.config.js in my root folder which contains the source and ouput directory
5. when i type the webpack command i am getting the below error.

webpack은 내부 또는 외부 명령, 작동 가능한 프로그램 또는 배치 파일로 인식되지 않습니다.

나는 오랫동안이 문제를 겪었습니다. (전역 적으로 설치된 webpack 등이지만 여전히 인식되지 않음) npm에 대한 환경 변수를 지정하지 않은 것으로 나타났습니다 (webpack.cmd 파일이 앉아 있음). 그래서 Path 변수에 추가합니다.

%USERPROFILE%\AppData\Roaming\npm\

Powershell을 사용하는 경우 다음 명령을 입력하여 경로에 효과적으로 추가 할 수 있습니다.

[Environment]::SetEnvironmentVariable("Path", "$env:Path;%USERPROFILE%\AppData\Roaming\npm\", "User")

중요 : 이 기능을 적용하려면 PowerShell 창을 닫았다가 다시 여는 것을 잊지 마십시오.

도움이 되었기를 바랍니다.

이 문제에 대한 더 나은 해결책은 Webpack전역 적으로 설치하는 것 입니다.

이것은 항상 작동하고 나를 위해 일했습니다. 아래 명령을 시도하십시오.

npm install -g webpack

대안으로 Webpack을 로컬에 설치 한 경우 다음과 같이 명령 프롬프트에서 찾을 위치를 명시 적으로 지정할 수 있습니다.

node_modules\.bin\webpack

(이것은 당신이 당신의 디렉토리 안에 있고 package.json당신이 이미를 실행했다고 가정 합니다 npm install webpack.)

npm install -g webpack-dev-server 당신의 문제를 해결할 것입니다

로컬 디렉토리에서 node_modules 를 삭제 하고 npm install을 다시 실행하십시오 .

package.json에 webpack 명령을 npm 스크립트로 추가하십시오.

{
    "name": "react-app",
    "version": "1.0.0",
    "scripts": {
      "compile": "webpack --config webpack.config.js"
    }
}

그런 다음 실행

npm 실행 컴파일

웹팩이 설치되면 ./node_modules/.bin 폴더에 바이너리가 생성됩니다. npm 스크립트는이 폴더에 생성 된 실행 파일도 찾습니다.

Webpack CLI는 이제 별도의 패키지로 제공되며 'webpack'명령을 사용하려면 전역으로 설치해야합니다.

npm install -g webpack-cli

편집 : 많이 변경되었습니다. Webpack 사람들은 CLI를 전역 적으로 (또는 개별적으로) 설치하는 것을 권장하지 않습니다. 이 문제는 지금 해결되어야하지만 적절한 설치 명령은 다음과 같습니다.

npm install --save-dev webpack

이 답변은 원래 OP 문제에 대한 "해결 방법"으로 의도되었습니다.

동일한 범위에 webpack과 webpack-cli를 설치해야합니다.

npm i -g webpack webpack-cli

또는,

npm i webpack webpack-cli

로컬에 설치하는 경우 구체적으로 호출해야합니다.

node_modules/.bin/webpack -v

우리는 또한이 문제를 경험했고 나는에 정의 된 스크립트 사용을 제안하는 모든 답변을 좋아합니다. package.json .

솔루션의 경우 종종 다음 순서를 사용합니다.

1. npm install --save-dev webpack-cli(웹팩 v4 이상을 사용하는 경우, 그렇지 않은 경우 npm install --save-dev webpack, 웹팩 설치 참조 , 2019 년 1 월 19 일 검색)
2. npx webpack

1 단계는 일회성입니다. 2 단계에서는 ./node_modules/.bin. 다음과 같이 두 번째 단계를 npm 스크립트로 추가 할 수도 있습니다 package.json.

{
   ...
   "scripts": {
      ...
      "build": "npx webpack --mode development",
      ...
   },
   ...
}

그런 다음 npm run build이 스크립트를 실행 데 합니다.

Windows 10의 npm 버전 6.5.0, webpack 버전 4.28.4 및 webpack-cli 버전 3.2.1에서이 솔루션을 테스트하고 PowerShell 창 내에서 모든 명령을 실행했습니다. 내 nodejs 버전은 10.14.2입니다. 또한 Ubuntu Linux 버전 18.04에서도 테스트했습니다.

특히 각기 다른 버전의 webpack이 필요할 수있는 많은 다른 프로젝트로 작업하는 경우 전역 적으로 webpack을 설치하지 않는 것이 좋습니다. 웹팩을 전역 적으로 설치하면 동일한 시스템의 모든 프로젝트에서 특정 버전으로 제한됩니다.

새로 설치하면 문제가 해결 될 수 있습니다. 이 "명령"은 이전의 모든 모듈을 제거하고 다시 설치합니다. 아마도 웹팩 모듈이 불완전하게 다운로드되고 설치되는 동안입니다.

npm clean-install

동일한 문제가 발생하여 package.json 파일에 코드 블록을 추가했습니다.

 "scripts": {
   "build": "webpack -d --progress --colors"
 }

그런 다음 터미널에서 명령을 실행하십시오.

npm run build

전역 적으로 WebPack 설치

npm install --global webpack

관리자 권한으로 명령 줄 (cmd)을 실행하면됩니다.

저장소를 방금 복제 한 경우 먼저 다음을 실행해야합니다.

npm install

프로젝트 종속성이 누락 된 경우 오류가 발생합니다. 위의 명령으로 다운로드하여 설치합니다.

npx webpack

그것은 나를 위해 일했습니다. Windows 10을 사용하고 있으며 웹팩을 로컬에 설치했습니다.

React 16.12.0으로 업그레이드 할 때이 문제가 발생 했습니다 .

DOM을 렌더링 할 때 webpack 과 상점 에 관한 두 가지 오류가 있습니다 .

Webpack 오류 :

webpack은 내부 또는 외부 명령, 작동 가능한 프로그램 또는 배치 파일로 인식되지 않습니다.

Webpack 솔루션 :

1. 관련 VS 솔루션 닫기
2. node_modules폴더 삭제
3. 삭제됨 package-lock.json
4. npm install
5. npm rebuild
6. 2 ~ 3 회 반복

상점 오류 :

Store <()> 유형은 Store <any, AnyAction> 유형에 할당 할 수 없습니다.

스토어 솔루션 :

내 React 버전을 업데이트하라는 제안이이 오류를 수정하지는 않았지만 상관없이 수행하는 것이 좋습니다.

내 코드는 다음과 같이 보입니다.

ReactDOM.render(
        <Provider store={store as any}>
            <ConnectedApp />
        </Provider>,
        document.getElementById('app')
    );

당 이 솔루션

동일한 오류가 발생하고 솔루션 중 어느 것도 저에게 효과가 없었고 노드를 다시 설치하고 환경을 복구했으며 모든 것이 다시 작동합니다.

저에게는 webpack을 별도로 설치하는 것이 좋습니다. 그래서 간단히 :

$npm install
$npm install webpack

왜 이것이 필요한지 잘 모르겠지만 효과가있었습니다.

아래 주어진 명령이 저에게 효과적이었습니다.

npm cache clean --force
npm install -g webpack

주 -이 명령을 관리자로 실행하십시오. 설치가 끝나면 명령 프롬프트를 닫고 다시 시작하여 적용된 변경 사항을 확인하십시오.

당신은 당신이 JS 모듈을 사용할 수 있도록 JS 프로젝트에 대한 상용구 폴더를 생성하는 경우 webpack와 Babel훌륭한 도구입니다.

webpack전체적으로 설치하지 마십시오. 둘 다 최신 버전을 설치하면 package.json파일이로드되고 향후 프로젝트를 위해 복사 할 준비가됩니다.

node_modules상용구 폴더의 파일 크기를 줄이려 면 폴더 를 삭제 한 다음 node_modules 사용을 다시 설치하십시오.npm install .

나는 설치 NPM 실행 잊고 내가 실행하는 데 필요한 실현 될 때까지 내 웹팩 dev에 서버를 실행하려고 할 때이 오류가 계속 npm install설치 node_modules하고는했다.

이 사람들을 시도하십시오, cli는 최신 버전으로 업데이트되어야합니다

npm install --save-dev @angular/cli@latest

크레딧은 R.Richards https://stackoverflow.com/a/44526528/1908827 로 이동합니다.

나를위한 수정은 devDependency로 webpack을 로컬로 설치하는 것이 었습니다. devDependenciesnode_modules 폴더에 설치되지 않았기 때문에 가지고 있습니다 . 그래서 나는 달렸다 npm install --only=dev

때때로 npm install -g webpack 이 제대로 저장되지 않습니다. npm install webpack --save 를 사용하는 것이 더 좋습니다 . 그것은 나를 위해 일했습니다.

나는 똑같은 문제가 있었고 그것을 알아낼 수 없었습니다. 모든 코드 줄을 살펴 봤지만 내 오류를 찾을 수 없었습니다. 그런 다음 잘못된 폴더에 webpack을 설치했음을 깨달았습니다. 내 오류는 webpack을 설치하는 폴더에주의를 기울이지 않았습니다.