The JS/TS language service immediately crashed 5 times 에러 해결하기

문제 발생

Vite를 사용해서 프로젝트 환경을 구성하고 싶었다.

yarn create vite vite-app

 

명령어를 입력하고 Framework: React, Variant: Typescript + SWC를 선택해서 프로젝트를 생성했다.

eslint-config-airbnb를 사용해보고 싶어서 관련 설정도 하고 prettier 설정까지 해줬다.

설정을 완료한 후 컴포넌트를 생성하는데, 이상하게 intellisense가 제대로 동작하지 않는 것 같았다.
<div> 태그에 style 속성을 주고 싶었는데 div와 관련없는 데이터만 나왔다.
이상하다 싶어서 vscode를 껐다 켰는데...

 

The JS/TS language service immediately crashed 5 times.
The service will not be restarted.

이런 알림이 떴다.

 

TSServer도 재시작해보고, eslint랑 prettier 관련 라이브러리도 제거해보고, 프로젝트도 다시 만들어보고, 검색도 해봤는데 해결할 수 없었다... ㅠㅠ

그래도 퇴근하고 3일동안 계속 이 문제에 매달린 결과... 해결 방법을 찾을 수 있었다!

 

해결 방법

우선 해결 방법은 2가지가 있다.

 

1. TypeScript 버전 다운

TypeScript 버전을 < 5.4.4 로 다운그레이드 한다.

 

2. vscode의 setting 변경

.vscode/settings.json에서 아래의 기능을 비활성화 시켜준다.
"typescript.tsserver.experimental.useVsCodeWatcher": false

 

나는 심플하게 vscode 셋팅을 바꿔줬다.

 

 

프로젝트를 생성할 때 기본적으로 설치되는 라이브러리들의 GitHub에 가서 Issues를 확인했다.

나랑 똑같은 문제를 겪고 있는 사람이 있을까 싶어서....

불편하더라도 우선 intellisense를 신경쓰지 말고 개발해야하나... 싶을 때쯤! yarn 깃허브에서 해결책을 찾을 수 있었다.

정답은 이곳에 있었다...

 

[Bug]: Patched tsserver crashes when using client watch · Issue #6270 · yarnpkg/berry

 

TypeScript >= 5.4.4 에서 VScode + Typescript + PnP 조합을 사용했을 때 문제가 발생한다.

 

느낀점

어떤 문제가 발생했을 때, 라이브러리의 github에서 Issues를 확인해보는 것은 아주 좋은 방법이다.

이 문제를 해결하기 위해 `yarn create vite`로 프로젝트 생성, 빌드를 반복하다 어제까지 됐던 빌드가 갑자기 안됐던 적이 있었다.

이 때도 4시간전에 따끈따끈하게 올라온 이슈를 보고 해결 방법을 찾았었다.

하루도 안되서 수정된 라이브러리가 올라오긴 했지만!

아무튼 포기하지 않으니 해결할 수 있었다 하하