Creating a new custom scope

To create a new custom scope

Select Local Changes or Shared from the drop-down list. Shared scopes are defined for the current project and accessible for the team members via VCS, while Local scopes are intended for personal use only and are stored in your workspace.

Specify the name for the new scope.

Apply changes.

You can change the sharing state later using the Share scope checkbox in the bottom of the page.

Configuring the list of items in a custom scope

To configure the list of items in a custom scope

In the Scopes settings page, select the scope that you want to configure.

Do one of the following:

Choose files and folders to be included in the scope and use buttons on the right. Based on the inclusion/exclusion, WebStorm creates an expression and displays it in the Pattern field.

Associating file color with a scope

Files belonging to different scopes can be highlighted in different colors throughout the WebStorm's user interface: in navigation lists, in the editor tabs, in the Project Tool Window. This allows much faster and easier navigation in large projects.

To associate file color with a scope

Decide whether you want the scope-color association to be only available to you or to be shared with the team. Depending on that, select or clear the checkbox Share colors section of the page.

Click Add .

In the dialog box that opens, select a scope and pick a color for it.

If necessary, use the checkboxes on top of the page to define where in the user interface files belonging to the scopes are highlighted.

Apply changes.

Arranging the order of scopes

If some file is included into several scopes, the order of the scopes becomes important: WebStorm uses the color of the uppermost scope (shown in the Scopes settings page) to highlight such file. Of course, you can change the order of the scopes, and thus the resulted highlighting.