I think this was caused by the extension called JavaScript and TypeScript Nightly. This was causing the syntax highlighting for .js and .ts files (.jsx and .tsx too). This was more of a bug with the latest version (currently 1.73.1).
You can disable the extension to enable the syntax highlighting.
This extension has now been updated and this issue is fixed.
Answer from Haneen on Stack OverflowI think this was caused by the extension called JavaScript and TypeScript Nightly. This was causing the syntax highlighting for .js and .ts files (.jsx and .tsx too). This was more of a bug with the latest version (currently 1.73.1).
You can disable the extension to enable the syntax highlighting.
This extension has now been updated and this issue is fixed.
What user Haneen said was correct, but instead of disabling it, you can install an old version that works just fine.
Click the cog on the bottom right → 'Install Another Version' → select an older version.
Cog at bottom right
The syntax highlighting disappeared suddenly when I was coding, I don't know what went wrong and I'm loving every single brain cell googling and not finding any solution to my problem. I have tried :
- reloading vscode
- reinstalling the babel extension
- change themes
No problem with HTML/CSS files, only javascript
I'm trying vscode after 1.5 years and its been smooth except that I have zero syntax highlighting for .js files.
It appears you want to disable the bracket pairs colorization.
Here's a blog post from the VSCode team, talking about this new highlighting feature introduced recently : https://code.visualstudio.com/blogs/2021/09/29/bracket-pair-colorization
To do so, set the following settings to false :
"editor.bracketPairColorization.enabled": false,
"editor.guides.bracketPairs": false,
I ran into this issue recently and I think the problem is caused by the Language Mode that VS Code used based on the language it detects.
I was using Auto Detect and I realized I should have been explicitly setting the language to Javascript using the button in the bottom right corner of the editor.
Bracket pair colorization will be preserved, but the syntax highlighting will change to what you expect.
Finally, Javascript seams to be the best, but Auto Detect may select Typescript or JSX where the Language mode is different.
Note: I think primitives, objects, and reserved words are hightlighted uniquely. It's helpful once you realize it.
I hope this helps someone else.
Helpful Images:
Javascript
Auto Detect
In my case, it was just the theme issue. After the latest update, VSCode changed the theme to Dark Modern which is fine, but I wanted to use my existing one so I selected the Dark Theme (but my previous one was actually Dark+).
The difference between the two is the syntax highlighting feature so switching to the Dark+ Theme fixed the syntax highlighting not being enabled.
I also had the same problem for TypeScript React (.tsx) files though in my case it was due to the JavaScript & TypeScript Nightly extension so disabling it fixed my syntax highlighting.