[문제해결] Error: error:0308010C:digital envelope routines::unsupported

에러

사건의 발단.

react router 설치하다가 여러 종류의 에러메시지를 만났다.

The v1 package contains DANGEROUS / INSECURE binaries. Upgrade to safe fsevents v2

어떻게 업데이트 하는지 몰라 이거 참고해서 다시 설치를 하려해도 에러가 나고..

https://points.tistory.com/90 -> 이렇게 해보려했으나 잘 안되서 헤매다가 npm run start 해봤더니 다음 에러 발생

Error: error:0308010C:digital envelope routines::unsupported

Starting the development server...

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at module.exports (/Users/me/development/react/movie-web/node_modules/webpack/lib/util/createHash.js:90:53)
    at NormalModule._initBuildHash (/Users/me/development/react/movie-web/node_modules/webpack/lib/NormalModule.js:386:16)
    at handleParseError (/Users/me/development/react/movie-web/node_modules/webpack/lib/NormalModule.js:434:10)
    at /Users/me/development/react/movie-web/node_modules/webpack/lib/NormalModule.js:466:5
    at /Users/me/development/react/movie-web/node_modules/webpack/lib/NormalModule.js:327:12
    at /Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at iterateNormalLoaders (/Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
    at /Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:236:3
    at runSyncOrAsync (/Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:130:11)
    at iterateNormalLoaders (/Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:232:2)
    at Array.<anonymous> (/Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
    at Storage.finished (/Users/me/development/react/movie-web/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
    at /Users/me/development/react/movie-web/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
/Users/me/development/react/movie-web/node_modules/react-scripts/scripts/start.js:19
  throw err;
  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at module.exports (/Users/me/development/react/movie-web/node_modules/webpack/lib/util/createHash.js:90:53)
    at NormalModule._initBuildHash (/Users/me/development/react/movie-web/node_modules/webpack/lib/NormalModule.js:386:16)
    at /Users/me/development/react/movie-web/node_modules/webpack/lib/NormalModule.js:418:10
    at /Users/me/development/react/movie-web/node_modules/webpack/lib/NormalModule.js:293:13
    at /Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/Users/me/development/react/movie-web/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at /Users/me/development/react/movie-web/node_modules/babel-loader/lib/index.js:51:103 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

 

이 블로그 참고해서 다운그레이드 해보려했으나 잘 안되었음.

그러다 아래 문서 참고해 조치함.

참고 문서

https://www.freecodecamp.org/news/error-error-0308010c-digital-envelope-routines-unsupported-node-error-solved/

원인

•  react-script version  5 미만 사용중이었음

에러 해결

 react-scripts 삭제 후 재 설치

npm uninstall react-scripts

npm install react-scripts

2.xx였던 리액트 버전이 업데이트되었다.

 

 

다시 설치했는데 여러가지 경고 메시지 뜸

npm WARN deprecated stable@0.1.8: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
npm WARN deprecated rollup-plugin-terser@7.0.2: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-terser
npm WARN deprecated w3c-hr-time@1.0.2: Use your platform's native performance.now() and performance.timeOrigin.
npm WARN deprecated sourcemap-codec@1.4.8: Please use @jridgewell/sourcemap-codec instead
npm WARN deprecated svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.

 

내가 사용중인 이 버전들이 deprecated 되었으니 이제 이 놈들을 사용하라, 라고 알려주었는데

나는 어떻게 설정을 바꾸는지 잘 몰라.. 찾아보다 이 블로그 참고해서 이렇게 바꿈 (참고: --save -dev)

npm install --save-dev @jridgewell/sourcemap-codec

 

설치하고 나니 package.json에 다음 코드가 추가됨

 

"devDependencies": {

"@jridgewell/sourcemap-codec": "^1.4.15"

}

더불어 아까 에러메시지에서 본 놈도 2.xx대로 업그레이드 되었다.

"optionalDependencies": {

"fsevents": "^2.3.2"

},

 

다시 npm run start 명령어 쳣더니 성공적으로 컴파일되었다.