Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Syntax Highlighting And Intellisense Import Suggestions Broken When Used With Babel ES6/ES7 Plugin

See original GitHub issue

Looks like syntax highlighting breaks when injectGlobal or `css’ isn’t in the file root:

cap1

The same is true whether wrapped in a function body or not. The eslint comment in the above example has no effect.

Probably related to #82

vscode-styled-components Version 0.0.17 VSCode Version 1.22.2 (1.22.2)

Issue Analytics

State:
Created 5 years ago
Comments:6 (2 by maintainers)

Top GitHub Comments

1reaction

Undistractioncommented, May 6, 2018

@Cu3PO42 Thank you. I switched from Babel ES6/ES7 to Babel JavaScript plugin and that seems to have fixed the highlighting issues. I’d suggest making a note of this in the README as Babel ES6/ES7 is far more popular (with over twice as many downloads). I’ll happily do this in a PR if that would be helpful.

Also note that intelisense import suggestions are broken when using Babel ES6/Es7.

Would you like me to open a fresh issue related to this incompatibility?

0reactions

ziedtouibicommented, Jun 20, 2018

it’s not working for me, everything work fine only if i disable “Babel javascript”

Top Results From Across the Web

Styled Components Intellisense Not Working - Stack Overflow

I installed vscode-styled-components but there is no syntax highlighting. Is there anyone having the same problem? I am using VSCode 1.73.

Editors - Babel.js

This guide should help you get the syntax highlighting to work. If you're looking for more advanced integrations, you may want to take...

Visual Studio Code Es6 Syntax Highlighting - ADocLib

I have the support for es6/es7 installed and already have a JavaScript (Babel) I @con-ssc Where can I check if I also have...

Wallaby.js Visual Studio Code Extension - Netlify

This extension provides AI-assisted IntelliSense by showing recommended completion items ... This means you get context-aware code completions, tool-tips, ...

Set Up Visual Studio Code and xDebug as the Ultimate Editor ...

In Visual Studio Code, I'll first open the plugin itself, ... the Babel ES6/ES7 extension, which adds syntax highlighting for ES6/ES7.