왜 갑자기 vulnerability 에러가...?

⚠️ 에러 상황

위의 사진처럼 무려 High 를 자랑하는 vulnerability 에러가 발생했다. 있어도 프로젝트는 잘 돌아가니까... 이미 평가도 끝났고... 무시하려다가 결국은 해결하기로 마음먹고 구글링을 시작했다.

⏭️ 진행 과정

에러 무지성 복붙을 하니까 여러 글을 찾을 수 있었는데, 그 중에서 이 글을 참고했다
여기서는 해결방법만 나와있었는데, 그래도 따라하기만 하니 해결이 되지 않았다. 그래서 여기서 참고했다는 github issues 로 들어가봤더니 똑같은 해결책을 보여주고 있었다.

내 에러 해결에는 도움이 되지 않았지만, 간단하므로 같이 남겨둔다.
package.json 파일에서

 "dependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "4.0.3"
  }

에 있는 react-scripts 를

 "dependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "react-scripts": "4.0.3"
  },

이렇게 devDependencies 로 옮겨준다.

그 다음 npm i를 해주고 npm audit 이 아닌 npm audit --production 을 해보면 더 이상 에러가 뜨지 않는 것을 볼 수 있다고 한다.

이렇게 하면 문제 해결은 안되고 그저 에러가 뜨지 않도록 하는 미봉책이 아니냐고 할 수도 있지만, 이게 곧 문제 해결까지 한 것이다.
이는 Create React App 의 특성 때문에 나타난 것인데, CRA는 빌드 툴임을 알아야 한다. CRA 는 꾸준히 계속 실행되는 Node application 이 아닌 개발과정중에서 빌드할 때만 실행되어 정적인 assets 을 생산한다. 하지만 npm audit 은 실행되고 있는 Node app을 위해 디자인 되었기에, 실제 Node app 을 실행할 때 발생할 수 있는 문제를 찾아준다. 하지만 CRA 에서는 이와 카테고리 자체가 다른 방식으로 실행된다. 따라서 CRA 에서 이와 같은 에러가 무수히 많이 보고되었지만 그 어떤 것도 이로인해 문제가 발생한 적이 없기에 잘못된 에러 (에러가 나면 안되지만 발생시키고 있는 에러라는 뜻 같다) 로 여기고 있다.
이는 우리 뿐만이 아니라 CRA 를 사용하는 사용자 입장에서도 많은 시간낭비를 유발하고 있다.

원문:
But isn't this just ignoring the problem?
No.
Create React App is a build tool. In other words, it doesn't produce a running Node application. It runs at the build time during development, and produces static assets.
However, npm audit is designed for Node apps so it flags issues that can occur when you run actual Node code in production. That is categorically not how Create React App works.
This means that the overwhelming amount of "vulnerability" reports we receive for transitive dependencies are false positives. Despite literally a hundred issues with thousands of comments about npm audit warnings in react-scripts, throughout the years not a single one of them (to the best of our knowledge) has ever been a real vulnerability for CRA users.
This is a huge waste of everyone's time. Mostly of yours, but of ours too.

하지만 나의 경우 yarn 을 사용하고 있었기에
yarn audit 을 하면

여전히 같은 문제를 뱉고 있었다.

그래서 더 구글링을 해본 결과 이 글을 따라했고, 드디어 문제가 해결됐다.

이번에도 에러 메세지를 잘 안읽어서 시간을 날린 케이스인데, 에러를 뱉고 있는 파일이 yarn.lock 이었다.

여기에 nth-check 를 검색해보면 통일되지 않은 2가지의 버전으로 나뉘어져 있었는데, 여기서

위의 사진중에 윗 부분은 지워주고

nth-check "1.0.2"를 쓰고있는 부분이 있으면 nth-check"2.0.1"로 모두 통일해주면 된다.
그리고 yarn 명령어로 다시 설치를 해준뒤에 yarn audit을 하게되면

더 이상 에러가 뜨지 않는 것을 볼 수 있다.

📌 배운 것

CRA 는 빌드 툴이며, 빌드 될 때에만 Node app 을 실행시키며 정적인 assets 을 생산한다는 것을 알게됐다. CRA 가 처음 배울 때 편하기는 한데... 역시 편하면서 완벽한 것은 없다는걸 다시금 느낄 수 있었다.