maksimr/vim-jsbeautify

JsBeautify() doesn't recognize jsx extension?

shri3k opened this issue · 4 comments

Hi again, I'm just wondering if we have to map our own key-binding for jsx files.
Currently, I have this:-

var React = require('react');
var MyClass = React.createClass({
   render: function() {
     return <h1> hello world </h1>;
   }
});

if I just use the key-map that was provided in the readme.md then I see that it calls JsBeautify() which gives me this output:-

var React = require('react');
var MyClass = React.createClass({
      render: function() {
          return <h1 > hello world < /h1>;
  }
});

which is not correct obviously. I revert this and now I manually call JsxBeautify() which gives me the correct output:-

var React = require('react');
var MyClass = React.createClass({
  render: function() {
    return <h1> hello world </h1>;
  }
});

My question is that is JsBeautify() supposed to detect jsx file and call JsxBeautify() instead or do we have to have different mapping for jsx files?

@sinkingshriek you should setup settings for jsx in jsx section of editorconfig.
You can put e4x = true to js and call JsBeautify on jsx files ;)
but I prefer using separate configuration.

Thanks!

Hmm, I do have that in my project's .editorconfig file.

; .editorconfig

root = true

[**.js]
indent_style = space
indent_size = 2

[**.jsx]
e4x = true
indent_style = space
indent_size = 2

[**.css]
indent_style = space
indent_size = 2

[**.html]
indent_style = space
indent_size = 2
max_char = 78
brace_style = expand

Really strange. I just checked to see if I have the latest code and in-fact I do or else I wouldn't be able to call JsxBeautify() manually. Although, git tags says I'm in 1.0.1 though but I don't think that's relevant to the issue here.

@sinkingshriek hm... I think I catch your problem
you can map your hotkeys like:

    autocmd FileType javascript nnoremap <buffer>  <c-f> :call JsBeautify()<cr>
    autocmd BufEnter *.jsx nnoremap <buffer>  <c-f> :call JsxBeautify()<cr>
    autocmd FileType javascript vnoremap <buffer>  <c-f> :call RangeJsBeautify()<cr>
    autocmd BufEnter *.jsx vnoremap <buffer>  <c-f> :call RangeJsxBeautify()<cr>

Oh man. I just realized what I've been doing wrong. I feel stupid for finding out this late.
I had

 ".vimrc
  map <c-f> :call JsBeautify()<cr>
  " or
  autocmd FileType javascript noremap <buffer>  <c-f> :call JsBeautify()<cr>
  " for html
  autocmd FileType html noremap <buffer> <c-f> :call HtmlBeautify()<cr>
  " for css or scss
  autocmd FileType css noremap <buffer> <c-f> :call CSSBeautify()<cr>

in my .vimrc file and completely overlooked the "or comment there. I took out

 map <c-f> :call JsBeautify()<cr>

and it's working just fine. Apologize for bothering you cause of my stupidity.