React jsx/tsx

[zelphir]

Comments using the default ft in .tsx files doesn't work, it still adds // . The only way I got it working was setting the ft to javascript.jsx, then comments were working fine for both jsx and normal js. I also tried setting the ft to javascriptreact but it didn't work either.

[tomtom]

Which version do you use?
Could you please provide me an code example?
I assume it uses typescriptreact (//) instead of tsx ({* ... *}).
What's the value of g:tcomment#filetype#guess? Does it help to set it to 1?
Does let g:tcomment#filetype#guess_typescriptreact = 1 help?

[tomtom]

I assume jsx works properly because the filetype is javascript.jsx and g:tcomment#filetype#guess_javascript = 1.

[zelphir]

I'm of latest master (2de3885).

As code example it's just a basic react jsx but using typescript, so something like:

export default function MyComp() {  
  const data = 1

  return (
    <div>
      <span>{data}</span>
    </div>
  )
}

Running:

set ft ==> filetype=typescriptreact
let g:tcomment#filetype#guess ==> g:tcomment#filetype#guess #0 

let g:tcomment#filetype#guess_typescriptreact = 1 doesn't make any difference 😢

Forcing the filetype to typescript.tsx doesn't work either.

[kuntau]

Hi. I just encounter this issue too but setting

let g:tcomment#filetype#guess_typescriptreact = 1

solve the problem. I hope tcomment can do this automatically, the extension always *.tsx

Cheers.

[s0meone]

I'm having the same problem, setting let g:tcomment#filetype#guess_typescriptreact = 1 only works for commenting not uncommenting. I've collected some debug info on the exact same cursor position, hope this helps fixing the issue:

With let g:tcomment#filetype#guess = 0

TCOMMENT: &ft = typescriptreact => typescriptreact
TCOMMENT: stx = tsxAttrib => tsxAttrib
TCOMMENT: ct  = {'_args': {'beg': 27, 'fallbackFiletype': '', 'end': 27, 'filetype': 'typescriptreact', 'comment_mode': ''}, 'commentstring': '{/* %s */}', 'mode': '', 'filetype': 'tsx'}

With let g:tcomment#filetype#guess = 1 or let g:tcomment#filetype#guess_typescriptreact = 1 (same results), commenting works, but uncommenting doesn't:

TCOMMENT: &ft = typescriptreact => typescriptreact
TCOMMENT: stx = tsxAttrib => tsxAttrib
TCOMMENT: ct  = {'_args': {'beg': 27, 'fallbackFiletype': '', 'end': 27, 'filetype': 'typescriptreact', 'comment_mode': ''}, 'commentstring': '{/* %s */}', 'mode': '', 'filetype': 'tsx'}

With the cursor in the commented JSX code (on an attribute):

TCOMMENT: &ft = typescriptreact => typescriptreact
TCOMMENT: stx = tsxBlockComment => tsxBlockComment
TCOMMENT: ct  = {'rxmid': '', 'rxend': '', '_args': {'beg': 27, 'fallbackFiletype': '', 'end': 27, 'filetype': 'typescriptreact', 'comment_mode': ''}, 'commentstring': '// %s', 'commentstring_rx': '\%%(// %s\|/* %s */\)', 'mode': '', 'filetype': 'typescript', 'replacements': {'*/': {'subst': '|)}>#', 'guard_rx': '^\s*/\?\*'}, '/*': {'subst': '#<{(|', 'guard_rx': '^\s*/\?\*'}}, 'rxbeg': '\*\+'}

I noticed that the comment string changes to the wrong format when the cursor is in the commented block.

[gegoune]

In Vue files it also just comments every block with <!-- -->.

[eduardoarandah]

In Vue files it also just comments every block with <!-- -->.

@cloggier Posted a solution for vue here #284

[gegoune]

@eduardoarandah Thanks, I would rather keep on using treesitter.

[gegoune]

@eduardoarandah You can now use treesitter with https://github.com/JoosepAlviste/nvim-ts-context-commentstring and any commentstring based commenting plugin (I use https://github.com/terrortylor/nvim-comment).