React Err : npm start 안되는 오류 해결 --openssl-legacy-provider

React Err : npm start 안되는 오류 해결 --openssl-legacy-provider

 

 

 

문제

유데미 강의를 듣던 중 npm start가 제대로 실행되지 않는 현상이 발생했다.
thow err 라는 문구와 함께 밑에 경고메세지들이 출력되었음.
간단히 보니 node 버전 업데이트 사항과 직결된 문제였다. (이래서 안전한 버전을 사용하는 것이 좋다)

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/joeun/Desktop/01-starting-project/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/Users/joeun/Desktop/01-starting-project/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (/Users/joeun/Desktop/01-starting-project/node_modules/webpack/lib/NormalModule.js:471:10)
    at /Users/joeun/Desktop/01-starting-project/node_modules/webpack/lib/NormalModule.js:503:5
    at /Users/joeun/Desktop/01-starting-project/node_modules/webpack/lib/NormalModule.js:358:12
    at /Users/joeun/Desktop/01-starting-project/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/Users/joeun/Desktop/01-starting-project/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at iterateNormalLoaders (/Users/joeun/Desktop/01-starting-project/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
/Users/joeun/Desktop/01-starting-project/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/joeun/Desktop/01-starting-project/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/Users/joeun/Desktop/01-starting-project/node_modules/webpack/lib/NormalModule.js:417:16)
    at /Users/joeun/Desktop/01-starting-project/node_modules/webpack/lib/NormalModule.js:452:10
    at /Users/joeun/Desktop/01-starting-project/node_modules/webpack/lib/NormalModule.js:323:13
    at /Users/joeun/Desktop/01-starting-project/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /Users/joeun/Desktop/01-starting-project/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/Users/joeun/Desktop/01-starting-project/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at /Users/joeun/Desktop/01-starting-project/node_modules/babel-loader/lib/index.js:59:103 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v18.12.1

 

기존코드

package.json 파일에 scripts 부분을 살펴보자

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

 

변경코드

--openssl-legacy-provider 를 추가 해 기존 버전을 공급 받을 수 있다.

https://stackoverflow.com/questions/69962209/what-is-openssl-legacy-provider-in-node-js-v17

  "scripts": {
    "start": "react-scripts --openssl-legacy-provider start",
    "build": "react-scripts --openssl-legacy-provider build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

해당 코드로 변경 후 npm start를 실행하면 정상적으로 작동되는 화면을 볼 수 있다!
물론 nvm 버전 매니저를 사용해 버전을 변경해도 상관없다