자바블로그

npm run dev 실행 시 에러가 발생되는 경우 해당 프로젝트에서 npm install 실행 후 run dev를 실행 해줘야 합니다.

1. cmd창 실행
2. cd 프로젝트폴더명
3. npm install (명령어 실행)

3번까지 작업시 해당 프로젝트 폴더 하위에 node_modules 폴더가 생성되고 모든 모듈이 설치 되게 됩니다.
이렇게 되면 프로젝트 별로 모듈을 install해줘야 하는데 옵션중 -g(global) 옵션을 이용해서

npm install -g 이렇게 설치도 가능 합니다. 
이 경우 설치 경로는 'C:\Users\사용자명\AppData\Roaming\npm\node_modules' 하위로 설치 되게 됩니다.

그 후 npm run dev 실행 시 해당 모듈을 찾을수 없다는 에러가 발생되게 됩니다.
'Couldn't find preset “env” relative to directory' 이런식으로 발생 됩니다. 

이 경우 프로젝트 폴더 하위에 node_modules 폴더 및 하위에 관련 모듈이 없기 때문에 발생되는 문제로
프로젝트 폴더 위치에서 'npm link babel-preset-env' 명령어를 실행하게 되면 node_modules 하위에 링크폴더가 생성되어 글로벌 모듈
폴더를 참조 할 수 있게 됩니다.
(webpack.config.js 파일을 수정해서 처리도 가능 할거 같습니다.)

추가로 run 명령어 실핼시 'Cannot find module 'webpack-cli/bin/config-yargs'' 같은 메시지가 출력되고 버전이 맞지 않는다는 메시지가 나오는경우
cli로 생성된 프로젝트 하위의 'package.json' 파일의 열어

"devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "babel-preset-stage-3": "^6.24.1",
    "cross-env": "^5.0.5",
    "css-loader": "^0.28.7",
    "file-loader": "^1.1.4",
    "vue-loader": "^13.0.5",
    "vue-template-compiler": "^2.4.4",
    "webpack": "^3.6.0",
    "webpack-dev-server": "^2.9.1"
  }

각 모듈의 버전 정보를 확인해서 
'npm install -g webpack@3.6.0' 과 같이 버전을 명시해서 install 해주시면 됩니다.
기존에  설치된 모듈은 
'npm uninstall -g webpack' 명령어로 삭제 후 설치 해주시면 됩니다.


-- npm install -g webpack (글로벌 위치에 webpack모듈 설치)
-- npm uninstall -g webpack (글로벌 위치의 webpack모듈 삭제)
-- npm install -g webpack@3.6.0(글로벌 위치에 3.6.0버전 webpack 모듈 설치)
-- npm link webpack(현재 프로제트 node_modules 폴더에 글로벌 참조하는 링크 폴더 생성)