미래에서온 영상 보고도 에러납니다. 이건 버전문제인건지 제로초님 봐주세요.

Question

제 코드가 계속 에러가 나서 제로초님 소스코드를 가지고 npm i 하고 실행해보니 똑같은 에러가 나더라구요. 이건 코드 잘못이 아니라 버전 문제인것 같은데 이것때문에 강의 진행이 안됩니다. 원인을 모르겠어요.. 에러코드입니다. ---- //package.json ``` {    " name " :   " number-baseball " ,    " version " :   " 1.0.0 " ,    " description " :   "" ,    " main " :   " index.js " ,    " scripts " :   {      " dev " :   " webpack serve --env development "    },    " author " :   " ZeroCho " ,    " license " :   " ISC " ,    " dependencies " :   {      " react " :   " ^17.0.1 " ,      " react-dom " :   " ^17.0.1 "    },    " devDependencies " :   {      " @babel/core " :   " ^7.11.6 " ,      " @babel/preset-env " :   " ^7.11.5 " ,      " @babel/preset-react " :   " ^7.10.4 " ,      " @pmmmwh/react-refresh-webpack-plugin " :   " ^0.4.3 " ,      " babel-loader " :   " ^8.1.0 " ,      " react-refresh " :   " ^0.9.0 " ,      " webpack " :   " ^5.3.2 " ,      " webpack-cli " :   " ^4.1.0 " ,      " webpack-dev-server " :   " ^3.11.0 "    } } // webpack.config.json const  path  =   require ( ' path ' ) ; const   ReactRefreshWebpackPlugin   =   require ( ' @pmmmwh/react-refresh-webpack-plugin ' ) ; module.exports   =   {   name :   ' number-baseball-dev ' ,   mode :   ' development ' ,   devtool :   ' inline-source-map ' ,   resolve :   {     extensions :  [ ' .js ' ,   ' .jsx ' ] ,    },   entry :   {     app :   ' ./client ' ,    },   module :   {     rules :  [        {         test :   / \. jsx ? $ / ,         loader :   ' babel-loader ' ,         options :   {           presets :  [             [ ' @babel/preset-env ' ,   {               targets :   {  browsers :  [ ' last 2 chrome versions ' ]  },               debug :   true ,              } ] ,              ' @babel/preset-react ' ,           ] ,           plugins :  [ ' react-refresh/babel ' ] ,          },         exclude :  path . join (__dirname ,   ' node_modules ' ) ,        }     ] ,    },   plugins :  [      new   ReactRefreshWebpackPlugin () ,   ] ,   output :   {     path :  path . join (__dirname ,   ' dist ' ) ,     filename :   ' [name].js ' ,     publicPath :   ' /dist ' ,    },   devServer :   {     publicPath :   ' /dist ' ,     hot :   true    } };

bluewolfox · Answer

확인해보니 webpack 버전 4로 바꾸니 돌아가더라구요. webpack 버전 5 이상에서는 어떻게 해결해야되나요?