Javascript mode cannot parse JSX

[SystemParadox]

According to #2606, JSX support was added to the Javascript mode back in 2015. However, it does not appear to work, even in the specific version specified when the support was added:

https://rawgit.com/ajaxorg/ace/ec5a1227c43fccfb34a6a9c842d9c4b288d1bf12/kitchen-sink.html

Try entering:

var x = <div></div>;

This results in:

Expected an identifier and instead saw '<'.
Missing ";" before statement
Unclosed regular expression.
Unrecoverable syntax error. (100% scanned).

I tried various other uses of JSX but it fails on all of them.

Thanks.

[mofux]

The jshint implementation is outdated and needs to be updated. I am seeing many "Too many errors (x% scanned)" warnings, mostly when using many arrow functions

[SystemParadox]

This error is from jshint? I would strongly recommend replacing that with eslint and babel-eslint.

Are there any customisation hooks for the linter/parser?

[rocketinventor]

@nightwing How much work is it to update/ rebuild jshint?

[rocketinventor]

@SystemParadox did you check the settings? Are you sure that you have JSX mode enabled?

[SystemParadox]

I have Javascript mode enabled. According to #2606, the "JSX" mode is for an obsolete and totally unrelated language. Looking at the patch, it appears that support for React JSX was added to the Javascript mode.

However, that support is only for syntax highlighting, which does appear to be working. The error is coming from jshint. Thanks to mofux for pointing this out.

For now I have disabled the jshint worker with setOption('useWorker', false).

[rocketinventor]

@SystemParadox If so, you should probably create an issue here and make sure to reference this issue.

[rocketinventor]

@SystemParadox Try looking in 'Javascript Support' for JSX in C9.

[nightwing]

This is indeed caused by an old version of jshint used in ace.
The plan for the future versions is to remove jshint from ace, and allow everyone to use a version of linter they prefer.
@rocketinventor c9 documentation may not be very useful here, since i think the issue is about using ace as a standalone library, and not about cloud9 ide.

[SystemParadox]

Thanks for the clarification. Feel free to close if this is covered by other issues.

[rocketinventor]

Many of the popular code editors for Sublime Text are actually written in Node.js; this might be something to look into.

[mofux]

@nightwing Can I bring my own linter yet? 🤓

And if so, is there some documentation I can refer to?

[BrunoQuaresma]

Any updates?

[NGambini]

Any update ? I am looking to use ace editor to write react code.

[SystemParadox]

I'd recommend vscode instead

[andrewnester]

For now our long-term thinking is to eventually replace such type of linting with LSP support on Ace side and LSP compatible workers / servers #3124

[andrewnester]

JSHint has been recently updated #4911 and now Ace supports JSX syntax as well