요새 이 강의를 보시는 분께..webpack.config.js에 관해서

Question

저는 이 강의대로 진행하고 npm run dev-server 명령어를 치면 에러가 발생했었습니다. 이런 경우에는 npm install webpack-cli --save 를 해주시고 webpack.config.js 에서 module 안에 loaders 를 rules 로 변경해주시면 정상적으로 실행이 가능합니다. 도움이 되셨으면 좋겠습니다. 감사합니다.

jeewonb0573 · Answer

이외에도 babel 을 es2015에서 7로 변경해야 합니다. 구글링해서 해보셔야 할 것 같아요...

nakaa151630 · Answer

윗분들 댓글보고 해결해서 정리해봅니다. 1. 강의대로 진행중 npm run dev-server 실행 시 cannot find module webpack-cli 에러 발생 2.    npm install webpack-cli --save 실행 3. package.json "devDependencies": {     "@babel/core": "^7.13.16",     "@babel/plugin-proposal-class-properties": "^7.10.4",     "@babel/preset-env": "^7.13.15",     "@babel/preset-react": "^7.13.13",     "babel-core": "^6.26.3",     "babel-loader": "^8.2.2",     "babel-preset-es2015": "^6.24.1",     "babel-preset-react": "^6.24.1",     "webpack": "^4.46.0",     "webpack-cli": "^3.3.12",     "webpack-dev-server": "^3.11.2"   }, 4. webpack.config.js module: {         rules: [             {               test: /\.jsx?$/,                loader: 'babel-loader',                 exclude: /node_modules/,                 query: {                     cacheDirectory: true,                     presets: ['@babel/preset-env', '@babel/preset-react']                 }             }         ]     }, 5. npm run dev-server 실행 시 cannot find module @babel/core 에러 발생 -> npm install --save-dev @babel/core 6. 다시 npm run dev-server 실행 시 5번과 비슷한 에러 발생(총 3번인가 발생) 5번 해결방법과 같이 모듈 설치 전 이렇게 해결했습니다.

oqoq590405 · Answer

"devDependencies": {     "@babel/core": "^7.11.1",     "@babel/plugin-proposal-class-properties": "^7.10.4",     "@babel/preset-env": "^7.11.0",     "@babel/preset-react": "^7.10.4",     "babel-loader": "^8.1.0",     "webpack": "^4.44.1",     "webpack-cli": "^3.3.12",     "webpack-dev-server": "^3.11.0"   }, -------------------------------------     module: {         rules: [             {                 test: /\.js$/,                 loader: 'babel-loader',                 exclude: /node_modules/,                 query: {                     cacheDirectory: true,                     presets: ['@babel/preset-env', '@babel/preset-react']                 }             }         ]     }, 이렇게 변경해보니 돌아갑니다.

Ten · Answer

이걸 지금봤네요 혼자 6시간씨름하고 겨우했는데.. 역시 개발자는 검색능력

chul kim · Answer

네.. 아마도 해당 강좌의 웹팩 설정은 많은 것을 바꾸셔야 할겁니다. 쉽지 않겠지만 화이팅입니다!

jeewonb0573 · Answer

저도 해당 문제가 발생했습니다~ 감사합니다 :)

jjejje · Answer

감사합니다 덕분에 도움되었습니다!!!