Skip to content
| Marketplace
Sign in
Visual Studio Code>Formatters>styco - styled components converterNew to Visual Studio Code? Get it now.
styco - styled components converter

styco - styled components converter

Daniel Huth

|
6,976 installs
| (4) | Free
Transform tags with inline style-props to styled components
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

StyCo README

Transform JSX-Tags with style-props to styled components.

VSCode Marketplace: Link

Demo

Demo

Usage

Either use the command StyCo with CTRL + SHIFT + P or the code action with CTRL + . while in the line of the style-attribute.

Configuration

There are several options that can be found in the options.

  • insertImportStatement: Insert import statement of the detected library if not existent. (default: true)
  • orderStyleByName: Order styles by name alphabetically. (default: false)
  • saveAfterExecute: Save the file after command execution. (default: true)
  • disableCodeAction: Don't show a CodeAction if a style-Attribute is found. (default: false)
  • objectSyntax: Output the styled component in object syntax. (default: false)
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft