How to enable className autocomplete on custom jsx tags (aka react components)?

I'm very new to vscode but i've set up about all the things I need. One more thing that is quite missing is the autocomplete for className attribute on custom jsx tags (aka react components). It simply does not recommend anything when on a custom tag.

I've tried searching for any extension that does this but couldn't find any, am I missing something here?

Solution 1:

As I know there is no way to show react attributes in autocomplete list for custom react tags.

But there is a way to add className attribute quickly by putting a dot and typing your class name then hitting tab. This will create the custom tag with the given class attribute.

To do this, you need to configure Emmet extension (It is a built-in extension)

Add these lines to your VS Code User Settings (or Workspace Settings) file:

"emmet.triggerExpansionOnTab": true,

"emmet.includeLanguages": { "javascript": "javascriptreact" }

Shift ⇧ + Command ⌘ + P and typing into the Command Palette: >settings.json.

Official Documentation at VS Code Web Site

Related Issue on VS Code Github