프론트 엔드 코드 실행 안되는 현상.. ( 해결중 )

인프런의 nest강의를 듣던중 프로젝트 진행을 위한 프론트엔드 코드가 준비되어 있었다.

 

해당 코드를 다운 받은뒤 서버를 키려 하니 에러가 발생하고 실행이 되지 않았따.

 

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at BulkUpdateDecorator.hashFactory (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:133790:18)
    at BulkUpdateDecorator.update (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:133692:50)
    at OriginalSource.updateHash (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack-sources2/index.js:1:19148)
    at NormalModule._initBuildHash (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65772:17)
    at handleParseResult (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65837:10)
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65928:4
    at processResult (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65651:11)
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65711:5
Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at BulkUpdateDecorator.hashFactory (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:133790:18)
    at BulkUpdateDecorator.update (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:133692:50)
    at OriginalSource.updateHash (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack-sources2/index.js:1:19148)
    at NormalModule._initBuildHash (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65772:17)
    at handleParseResult (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65837:10)
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65928:4
    at processResult (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65651:11)
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65711:5
node:internal/crypto/hash:71
  this[kHandle] = new _Hash(algorithm, xofLen);
                  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at BulkUpdateDecorator.hashFactory (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:133790:18)
    at BulkUpdateDecorator.update (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:133692:50)
    at OriginalSource.updateHash (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack-sources2/index.js:1:19148)
    at NormalModule._initBuildHash (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65772:17)
    at handleParseResult (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65837:10)
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65928:4
    at processResult (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65651:11)
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:65711:5
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:30739:3
    at iterateNormalLoaders (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:30565:10)
    at Array.<anonymous> (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:30556:4)
    at runCallbacks (/Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:20166:15)
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:20339:4
    at /Users/hyeontaelee/Downloads/frontend/node_modules/next/dist/compiled/webpack/bundle5.js:29533:16 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

 

npm install로 다시 설치해보고 

 

npm run build / npm run start / npm run dev 

 

3개를 실행하면

 

Npm run build: 에러는 노출되지 않지만 .next파일에 아무것도 생기지 않는다 

 

npm run start : .next에 파일이 존재하지 않는다고 에러메시지 노출된다.

 

npm run dev : react >= 18.2.0 이어야 한다고 에러메시지가 노출된다.

 

일단 가장 해결하기 쉬운 react 버전 업데이트를 시도하였으나 오류가 발생한다.

 

package.json에 react 버전이 17.0.2 버전으로 되어있는거같아서 그런거 같다.