13

the .? operator

I am running vscode version 1.39.2. The Syntax highlighting messes up for React fragments and new ES syntax.

SaiBorg
  • 326
  • 2
  • 14
  • What is the source of the errors? Is it VS Code itself or something like eslint? Does this still happen if you disable all of your installed extensions? – Matt Bierner Oct 16 '19 at 18:47

2 Answers2

29

VSCode supports JSX fragment syntax. This problem is likely related to an extension in OP's editor. I found that disabling Babel ES6/ES7 v0.0.4 alleviated this issue for me.

As for the second issue, the latest stable release of VSCode v1.40.0 doesn't support syntax highlighting for optional chaining (i.e. ?.), but the next minor version v1.41 will include it. In the meantime, there are other options you have for adding this feature, detailed by Matt Bierner here.

veekas ashoka
  • 416
  • 4
  • 6
  • VS Code support JSX fragments in both JavaScript and TypeScript out of the box – Matt Bierner Nov 16 '19 at 02:08
  • I hope that my edit helps alleviate your concerns, Matt. – veekas ashoka Nov 17 '19 at 03:52
  • Thanks for the edit. No need to for the complications though: JSX fragment syntax is been supported for both JS and TS for two years now. The TypeScript server powers IntelliSense for both JS and TS which is what that release notes are referring too. However you are correct that the OP's issue was almost certainly caused by that outdated extension – Matt Bierner Nov 17 '19 at 20:07
  • 5
    Thanks! The Babel plugin was the issue in my case also. Disabling it did the trick! – gion_13 Nov 28 '19 at 16:11
  • Disabling babel helped with Fragment but the .? still messed up. – SaiBorg Dec 03 '19 at 00:01
  • I completely overlooked that part of the question. Updated my answer with that info. – veekas ashoka Dec 04 '19 at 04:50
  • 1
    Same error here. Disabling Babel ES6/ES7 fixed the highlighting, otherwise, instead of using the <> notation for fragments you can use the old notation and the red highlighting errors should go away – Andrew J Winkler Sep 27 '20 at 19:05
9

Disabling Babel E6/E7 extension in VScode worked for me.

Akanksha
  • 121
  • 1
  • 2