WebStorm
 
2022.2
Shortcuts: Windows
Get WebStorm
You are viewing the documentation for an earlier version of WebStorm.
  1. Reference
  2. Settings/Preferences
  3. Editor
  4. Code Style
  5. Other File Types

Other File Types

Last modified: 21 July 2022

File | Settings | Editor | Code Style | Other File Types for Windows and Linux

WebStorm | Preferences | Editor | Code Style | Other File Types for macOS

Ctrl+Alt+S the Settings/Preferences icon

Scheme

In this area, choose the code style scheme and change it as required. Code style scheme settings are automatically applied every time WebStorm generates, refactors, or reformats your code.

The IDE comes with two pre-defined schemes: the Project scheme and the Default scheme.

  • In the Project scheme, the settings that you configure apply only to your current project.

    These settings are stored in the codeStyles folder under .idea and are shared through VCS together with the project.

    The IDE creates the folder after you modify code style settings for your project.

  • In the Default scheme (IDE-level scheme), the settings that you configure apply to all existing projects that have the Default code style scheme selected.

    These settings are stored in the codestyles folder under the WebStorm configuration directory and are not shared through VCS.

If you want to use the project code style scheme as your default scheme, you can copy it to the IDE level. The other way around is also possible: you can overwrite your current project settings with the settings from an IDE-level scheme and share them with other members of your team.

Item

Description

Scheme

From this list, select the scheme to be used. The predefined schemes are shown bold. The custom schemes, ones created as copies of the predefined schemes, are in plain text. The location where the scheme is stored is written next to each scheme, for example, the Default scheme is stored in the IDE, the Project scheme is stored in the project.

Show Scheme Actions

Click this button to invoke the list of commands to manage the schemes:

  • Copy to IDE: select this option to copy the scheme settings to WebStorm.

    tip

    The option is available only for the Project scheme.

  • Export: select this option to export the selected scheme in the IntelliJ IDEA code style XML or EditorConfig format (if the EditorConfig plugin is enabled).

    Export code style scheme

    Learn more from Manage code style on a directory level with EditorConfig.

    tip

    The option is available for the Project and IDE schemes.

  • Import Scheme: select this option to import the scheme of the selected type from the specified location.

    Import the scheme

    tip

    The option is available for the Project and IDE schemes.

  • Copy to Project: select this option to overwrite your current project code style settings with the settings from the selected IDE code style scheme.

    tip

    The option is available only for IDE schemes.

  • Duplicate: select this option to create a copy of the selected scheme.

    tip

    The option is available only for IDE schemes.

  • Reset: select this option to reset the default or bundled color scheme to the initial defaults shipped with WebStorm. This command becomes available only if some changes have been done.

    tip

    The option is available only for IDE schemes.

  • Rename: select this option to change the name of the selected custom scheme. Press Enter to save changes, or Escape to cancel.

    tip

    The option is available only for IDE schemes.

Tabs and Indents

Use tab character

  • If this checkbox is selected, tab characters are used:

    • On pressing the Tab key

    • For indentation

    • For reformatting code

  • If the checkbox is cleared, WebStorm uses spaces instead of tabs.

Smart tabs

An indentation consists of two parts. One part results from nesting code blocks, and the other part is determined by alignment.

  • If this checkbox is selected, the part that results from nesting contains both tabs and spaces (if necessary), while the part defined by alignment consists only of spaces.

  • If this checkbox is cleared, only tabs are used. This means that after reformatting a group of spaces that fits the specified tab size is automatically replaced with a tab, which may result in breaking fine alignment.

tip

The Smart Tabs checkbox is available if the Use tab character checkbox is selected.

Tab size

In this field, specify the number of spaces that fits in a tab.

Indent

In this field, specify the number of spaces to be inserted for each indent level.

See also

Procedures