在 vscode 的 jsx 中为 css 启用自动完成/智能感知

Question

Is there an extension for css in jsx (not sure if that is the name, example below) that will enable css autocomplete/intellisense and maybe color syntax in vs-code.

For css in jsx I mean this:

<style jsx>{`
  .class{
     font-size:16px;
  }
`}</style>

Answer 1

Here is simple solution.

First Create a CSS file (eg style.css)

yourStyle.css (File)

.my-style{
    color:red;
    background-color:green;
}

and then in your js File simple import This CSS file

import './yourStyle.css'

Answer 2

This one seems to work pretty well: https://github.com/Divlo/vscode-styled-jsx

Answer 3

I have found this extension https://marketplace.visualstudio.com/items?itemName=blanu.vscode-styled-jsx for Syntax highlighting for styled-jsx but not for autocomplete/IntelliSense

Update: You can use both vscode-styled-components and styled-jsx Language server for achieving this.