Visual Studio tooling

[Daniel15]

Some sort of Visual Studio tooling for JSX where the standard JavaScript navigation and refactoring tools still work. This is a long time ambitious task. I have no experience with creating tooling for Visual Studio. Assistance would be fantastic!

Alternatively, some ReSharper tooling could be made instead, if it's easier. This would give syntax highlighting and ReSharper's tooling at least. See ForTea, which is a plugin for ReSharper to implement support for T4 templates. T4 is very similar in that it's a new syntax with existing syntax embedded in it. T4 is a custom syntax with embedded C# code, JSX could be seen as a custom syntax with embedded JavaScript.

[paulirwin]

JSX support is currently top of the User Voice for Web Essentials -- IMO, it would be the better option to add it to Web Essentials than having a separate extension.

http://webessentials.uservoice.com/forums/140520-general/suggestions/4935998-add-reactjs-jsx-support

[Daniel15]

@paulirwin I definitely agree, whether Microsoft actually add it or not is another thing altogether :) I really hope they do though.

[jordwalke]

They'll need to add general syntax transform support because we will continue to evolve the syntax of JSX. We'll provide sourcemaps, but we can't guarantee that the syntax will be pinned to a particular form.

[paulirwin]

@jordwalke Who says Web Essentials would have to transform anything? Just add a JSX template file, syntax highlighting, tag completion, etc. would be fine. We can still leave React.net to do the transformation to JS.

[Daniel15]

Debugging will be difficult to integrate unless something like Web
Essentials (or Visual Studio itself) adds hooks that let us integrate into
it. The debugger has to know how to use source maps which probably couldn't
be done in an extension.

Sent from my mobile.
On Jul 9, 2014 5:27 PM, "Paul Irwin" notifications@github.com wrote:

@jordwalke https://github.com/jordwalke Who says Web Essentials would
have to transform anything? Just add a JSX template file, syntax
highlighting, tag completion, etc. would be fine. We can still leave
React.net to do the transformation to JS.

Reply to this email directly or view it on GitHub
#3 (comment).

[jordwalke]

And autocomplete? How does it know the semantics of JSX? Since it doesn't, it has to first transform the source, and after it does that, it won't know where your respective cursor location is in the transformed output, and therefore how to complete. Is this correct?

[paulirwin]

If VS Web Essentials took a similar approach to the Sublime addon I think it would meet most people's needs. AFAIK Sublime JSX doesn't transform the JSX at all, just provides syntax highlighting and the usual Sublimey autocomplete based on similar words used in the open documents.

[jordwalke]

The Visual Studio JS editing experience is amazing and no sublime plugin comes close. The goal should be to match the JS editing experience in Visual Studio, but with JSX syntax supported. That means semantic completion etc.

[Daniel15]

The Sublime approach is mostly terrible though. Picking up random words with no context is not Intellisense. This is a huge feature that differentiates IDEs from simple text editors.

[abergs]

I'd be super hapyp just to get some syntax highlighting. Have to switch to sublime in order to write .jsx files currently.

[Daniel15]

Try voting for the feature request at http://webessentials.uservoice.com/forums/140520-general/suggestions/4935998-add-reactjs-jsx-support - Currently it's very hard for a third-party extension to easily implement JSX syntax highlighting as the current JavaScript support is not designed to be pluggable :(

I started prototyping doing it with ReSharper. While that's an easier approach at the moment, it also takes a lot of work to actually get it working.

[Daniel15]

This won't be possible until Microsoft add support for extending their JavaScript editor. Closing this out.