😡 에러 : 맥OS의 node 버전(23.3.0)과 vscode에서의 node 버전(18.20.4)이 일치하지 않는 오류
❌ 에러 메세지 :
알 수 없는 컴파일러 옵션 'noUncheckedSideEffectImports'입니다.ts
📝 이 오류를 해결하려던 계기
-
tsconfig.app.json 파일에서
"noUncheckedSideEffectImports": true이 부분에서 발생한 오류가 해결이 안되고 있었다. -
noUncheckedSideEffectImports이 옵션이 대체 뭐길래 알 수 없다는건지... 알아보던 중 해당 옵션에 대한 내용이 담긴 github 링크를 보게 되었다. (https://github.com/vercel/next.js/issues/70106)
-
next.js에 관한 링크이긴 하지만, 에러 해결에 도움이 될까 싶어 보다보니 Provide environment information에 node 버전이 22.8.0 버전이었다.
-
맥OS에서는 분명 node 버전을 23.3.0으로 업데이트 해놓았는데, vscode에서 node -v 해보면 18.20.4 버전이 보였다.
-
혹시나... node 버전이 22 이하여서 noUncheckedSideEffectImports 옵션을 인식 못하나...?! 하는 마음에 지푸라기 잡는 심정으로 vscode의 node 버전을 맥OS에서 최신화해놓은 node와 같게 만드는 시도를 하기 시작했다.
🩶 해결 시도
(nvm은 정상적으로 설치되어 있다는 전제 하에 아래 내용 진행)
1. node 최신버전 설치하기
nvm install 23.3.0- 설치 가능한 node 버전 모두 확인하는 방법
(엄청난 스압주의의 node 버전 리스트가 쭉 조회된다.)nvm list-remote
2. vscode에서 node가 설치되어 있는 경로 확인하기
which node- 내 경우는
/opt/homebrew/bin/node가 떴는데,.nvm아래의 경로에 node가 있어야 맥OS에서도, vscode에서도 같은 버전의 node가 열린다고 한다. - node가 설치된 경로를 변경하려면 .zshrc 파일에 관련 내용을 작성해야한다. 나는 .zshrc 파일이 없어서 새로 만들었다.
3. .zshrc 파일 생성하기
touch ~/.zshrc- .zshrc 파일에 아래 내용 작성
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"
export PATH="$NVM_DIR/versions/node/$(nvm version)/bin:$PATH"
4. vscode에서 수정된 .zshrc파일 내용 적용하기
source ~/.zshrc- node의 설치 경로가 정상적으로 변경되었는지 + vscode에서 node 최신 버전이 정상적으로 출력되는지 확인하기
which node
node -v/Users/innes/.nvm/versions/node/v23.3.0/bin/node경로로 수정된 걸 확인할 수 있었다.- node 버전도 23.3.0 으로 정상적으로 변경된 걸 확인했다.
안타깝게도... 원래 해결하려던 에러는 node 버전 업데이트로 해결되지 않았지만, 맥OS와 vscode의 버전 동기화는 성공할 수 있었다...!
