'Visual Studio Code Intellisense for style CSS in React?

Is it possible to get autocomplete or suggestions or intellisense or something for CSS when developing in React?

example

For example, when I write something like this I want to be able to see all the possibilities for that CSS property. I know that I can get this if I use .css files but sometimes I want to use inline CSS for something and it's really annoying that I have to google every time to see what I can use.

cssreactjsvisual-studio-code


Solution 1:[1]

Maybe you can use this. (Similiar to StyleSheet.create() in React Native): https://github.com/sutanlab/react-styles-hook

Solution 2:[2]

I don't think there is some extension that will help you because CSS keeps getting better day by day. So, the maximum you can achieve is create a cheatsheet and use that for every project.

You can install IntelliSense for CSS class names in HTML by Zignd. It is VS Code extension that loads your CSS on program launch and provides autocomplete for that.

Solution 3:[3]

I do not think it is necessary since most of the time, if you are using too many CSS, you are going to have modularity and have external css file. But for you, how about temporarily changing "Language Mode" to css. This may need extra clicks, but it will give you CSS auto-completions or suggestions in Visual Studio Code.

Solution 4:[4]

If you are using Styled-Components then try using this Extension:

Extension Name: vscode-styled-components by Julien Poissonnier

https://marketplace.visualstudio.com/items?itemName=styled-components.vscode-styled-components

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Sutan Nasution
Solution 2
Solution 3 Kyi Zet
Solution 4 onepix

Related Questions