JSX extension?

[lazywei]

Hi,

I'm wondering if this works with .jsx extension. It seems the String Template is not highlighted in .jsx file extension. I'm using yajs.vim and javascript-libraries-syntax.vim, and I'm not sure how I can configure my vim to work with .jsx files.

Thanks.

[othree]

Try install vim-jsx It should work without any configuration.

[lazywei]

Actually, I was using vim-jsx until I met yajs, and I thought yajs might cover jsx. So vim-jsx, yajs, and javascript-libraries-syntax can work together without any configuration, right?

Thanks.

[lazywei]

After turning on vim-jsx, it seems the template string still doesn't work, though.

[othree]

One possible reason is in your vim color theme. Statement and String are the same color. Could you take a look?

And you need both yajs.vim and vim-jsx work together. vim-jsx will let jsx file to be treat as javascript file in Vim. Then Vim will load yajs for the basic syntax.

[othree]

This is what I saw on my computer.

[lazywei]

I've just checked that the String & Statement color is not the same. Please refers to https://github.com/junegunn/seoul256.vim/issues/19#issuecomment-76510744

[lazywei]

Also, I found that the indention will not work correctly if I disable this plugin: https://github.com/pangloss/vim-javascript. I thought yajs should work as drop-in replacement for that plugin? Thanks.

[othree]

yajs.vim is just syntax file, don't do any indent stuff. In this role, I can't do any change to pangloss/vim-javascript. This is already a plugin for Vim.

[othree]

Do template string looks correct when you disable pangloss/vim-javascript? If it looks correct. One thing you can do is delete the syntax file in pangloss/vim-javascript in your .vim.

[lazywei]

The template string doesn't work correctly even I disable pangloss/vim-javascript. Also, I tried use other colorscheme as you do -- the jellybeans, but it turns out the template string still doesn't work.

Here are plugins I use for javascript, is there any plugin I should use or should not use?

" Javascript...
Plug 'kchmck/vim-coffee-script'
Plug 'marijnh/tern_for_vim', { 'do': 'npm install' }
Plug 'mxw/vim-jsx'
Plug 'othree/javascript-libraries-syntax.vim'
Plug 'othree/yajs.vim'
Plug 'justinj/vim-react-snippets'
" Plug 'pangloss/vim-javascript'
" Plug 'nanotech/jellybeans.vim'

[othree]

Could you install this plugin to see what is the highlight trace for template strings https://github.com/gerw/vim-HiLinkTrace

[lazywei]

I run :HTL on the template strings:

SynStack:  javascriptBlock->javascriptBlock->javascriptProp->javascriptFuncCallArg->javascriptTemplate  HltTrace: j
avascriptTemplate->String          fg<107> bg<-1>

[othree]

I found the reason is special characters _, ., (). For now I just accept \w characters. I will fix it later. Thank you.

[lazywei]

got it, thanks for the effort, and thanks for helping me locating the problem! :+1: