Syntax error with .tsx files - CoC does not recognise .tsx files to have .jsx syntax

[jininvt]

I am getting errors on all TSX / JSX code in my .tsx file. Attached is a screenshot of the App.tsx file you get when you run npx create-react-app --template typescript repo-name

One example of an error I'm seeing is: [tsserver 2304] [E] Cannot find name 'className'.

It seems that CoC does not recognise that .tsx files have .jsx syntax. Btw there is no issue with any .jsx files.

[chemzqm]

Fix your filetype option

[jininvt]

And how can I do that exactly? I've followed the instructions on the CoC Github page but the problem is still occurring.

Below is the updated coc-settings.json file. I've added in Lines 14 to 19.

[chemzqm]

Please read https://github.com/neoclide/coc-tsserver#coc-tsserver

[jininvt]

From what I understand I have to use g:coc_filetype_map to map tsx to typescriptreact. I have look at the example here but it still doesn't work. What am I missing?

[saltedpotatos]

For anyone else having this issue, this fixed it for me.

Quoting here in case link goes down:

Had a similar issue. Does :set ft output typescript?

If so, tsserver needs filetype to be ˋtypescriptreact` to parse your file as intended.

Add the following to your init.vim file:

augroup ReactFiletypes
autocmd!
autocmd BufRead,BufNewFile *.jsx set filetype=javascriptreact
autocmd BufRead,BufNewFile *.tsx set filetype=typescriptreact
augroup END

[rafaVls]

For anyone else having this issue, this fixed it for me.

Quoting here in case link goes down:

Had a similar issue. Does :set ft output typescript? If so, tsserver needs filetype to be ˋtypescriptreact` to parse your file as intended. Add the following to your init.vim file:

augroup ReactFiletypes
  autocmd!
  autocmd BufRead,BufNewFile *.jsx set filetype=javascriptreact
  autocmd BufRead,BufNewFile *.tsx set filetype=typescriptreact
augroup END

I had the same problem. and this solution fixed it for me.