ERR_OSSL_EVP_UNSUPPORTED 오류 해결

styled-components라는 library 설치 시 ERR_OSSL_EVP_UNSUPPORTED 오류가 보여 chat gpt 도움 받고 해결했다.

설치 명령어(뒤에 --save 없어도 됨):

npm install styled-components

설치 후, 앱 실행에 실패해 vscode & browser 종료했다 재시작 시에도 아래 문구가 보였다.

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:79:19)
    at Object.createHash (node:crypto:139:10)
    at module.exports (C:\myReact\my-app\node_modules\webpack\lib\util\createHash.js:90:53)
    at NormalModule._initBuildHash (C:\myReact\my-app\node_modules\webpack\lib\NormalModule.js:401:16)
    at handleParseError (C:\myReact\my-app\node_modules\webpack\lib\NormalModule.js:449:10)
    at C:\myReact\my-app\node_modules\webpack\lib\NormalModule.js:481:5
    at C:\myReact\my-app\node_modules\webpack\lib\NormalModule.js:342:12
    at C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:373:3
    at iterateNormalLoaders (C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:214:10)
    at iterateNormalLoaders (C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:221:10)
    at C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:236:3
    at runSyncOrAsync (C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:130:11)
    at iterateNormalLoaders (C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:232:2)
    at Array.<anonymous> (C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:205:4)
    at Storage.finished (C:\myReact\my-app\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:55:16)
    at C:\myReact\my-app\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:91:9
C:\myReact\my-app\node_modules\react-scripts\scripts\start.js:19
  throw err;
  ^
Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:79:19)
    at Object.createHash (node:crypto:139:10)
    at module.exports (C:\myReact\my-app\node_modules\webpack\lib\util\createHash.js:90:53)
    at NormalModule._initBuildHash (C:\myReact\my-app\node_modules\webpack\lib\NormalModule.js:401:16)
    at C:\myReact\my-app\node_modules\webpack\lib\NormalModule.js:433:10
    at C:\myReact\my-app\node_modules\webpack\lib\NormalModule.js:308:13
    at C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:367:11
    at C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:233:18
    at context.callback (C:\myReact\my-app\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
    at C:\myReact\my-app\node_modules\babel-loader\lib\index.js:51:103 {
  opensslErrorStack: [
    'error:03000086:digital envelope routines::initialization error',
    'error:0308010C:digital envelope routines::unsupported'
  ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}
Node.js v20.18.1

---

해결법:
package.json의 scripts 섹션에서 start 스크립트 수정:

"start": "react-scripts start" → "start": "react-scripts --openssl-legacy-provider start"

그런 다음 재실행:

npm start

정상 결과가 나왔다.