해볼까?: vim 에서 JSX.IntrinsicElements 에러 수정

2023년 5월 27일 토요일

vim 에서 JSX.IntrinsicElements 에러 수정

vim 8 + coc-tsserver 으로 .tsx 파일을 열었는데 다음과 같은 에러가 보인다.

Property 'div' does not exist on type 'JSX.IntrinsicElements'. (tsserver 2339)

검색해보면 주로 컴포넌트 이름을 소문자로 잘못 써서(<Hello> 를 <hello> 로 사용) 나오는 것 같다.

하지만 이 경우는 div 로 기본 html 태그이니 에러가 나오는 것은 이상하다.

JSX.IntrinsicElements 이란 를 보고 설치된 모듈을 검색해 봐도 잘 들어있다.

$ grep 'interface IntrinsicElements {' -wrn  node_modules/
node_modules/@types/react/ts5.0/index.d.ts:3177:        interface IntrinsicElements {
node_modules/@types/react/index.d.ts:3209:        interface IntrinsicElements {
$ sed -n '/interface IntrinsicElements {/,/\<div\>/p' node_modules/@types/react/index.d.ts
        interface IntrinsicElements {
    . . .
            div: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;

찾다보니 coc-tsserver 에 tsserver.tsdk 와 tsserver.useLocalTsdk 설정이 있는 것을 알았다.
tsserver.tsdk 는 IntelliSense 사용을 위해 lib*.d.ts 를 찾을 수 있는 TypeScript 설치 경로를 지정하고, tsserver.useLocalTsdk 는 workspace (node_modules 아래)에서 찾는다.

다음과 같이 vim 에서 coc 설정 파일을 열고 workspace 의 모듈을 사용하도록 설정을 추가한다.

:CocConfig
{
  "tsserver.useLocalTsdk": true
}

참고로 vim 시작시 coc 가 시작하지 않게 하려면 .vimrc 에 다음을 추가한다.

let g:coc_start_at_startup = v:false

도중에 시작은

:CocStart