WebStorm 2019.2 Help

Search for a target and usages within a project

You can search for occurrences and usages of targets within a project, and narrow your search by using different scopes and excluding certain items.

Find the search string in a project

  1. From the main menu, select Edit | Find | Find in Path Ctrl+Shift+F.

  2. In the search field, type your search string. Alternatively, in the editor, highlight the string you want to find and press Ctrl+F. WebStorm places the highlighted string into the search field.

    To see a list of your previous searches, press Alt+Down.

    If you need, specify the additional options.

    Find in path

    WebStorm lists the search strings and files containing them.

    To do a multi-line search, click the Multi-line search icon to enter a new line, and press Ctrl+Alt+Down/Ctrl+Alt+Up to browse through occurrences.

  3. Check the results in the preview area of the dialog where you can replace the search string or select another string, press Ctrl+Shift+F again and start a new search.

  4. If you need to see the list of occurrences in a separated tool window, click Open in Find Window. You can use this window and its options to group the results, preview them, and work with them further.

You can use different options in the Find in Path dialog to adjust your search process.

  1. In the Find in Path dialog, select options such as Words or Match case to find the exact word in a project, or match the letter case.

    See the search with regex documentation to learn how to use regex in your search.

  2. Click the filter icon to filter your search. For example, you can filter the search to omit comments or search only in comments instead.

  3. Select Directory to limit your search to a specific folder. Moreover, you can select the Scope option that offers you a list of predefined scopes for your search.

    For example, you can limit your search to the test files in your project.

    Limited search
    If you work without tabs, the scope Recently Viewed Files or Recently Changed Files option might become quite useful. You can also create your own custom scope, click the ellipsis icon icon to open the Scopes dialog.

Search in the specific file types

Use the File Mask option to narrow your search to a specific file type. You can select the existing file type from the list, add a new file type, or add an additional file mask syntax to search for file types with certain patterns.

  1. In the Find in Path dialog, select the File Mask checkbox and from the list of file types, select the one you need.

    File mask search
    WebStorm limits its search to the specified type.

  2. If you don't find the file type you need in the list, enter your file type in the File Mask field.

    For example, use the following syntax to search only in json files: *.json.

    Besides *, other wildcards are supported. If necessary, specify several file types using commas as separators.

    Add a new file type

Search for usages in a project

You can search for usages of a symbol in your whole project or in a scope that you set. WebStorm lists the search results in the Find tool window or in a popup, the pop can be used for quick navigation.

  • To show the search results in the Find tool window, position the caret at the symbol for which you want to find usages and select Edit | Find | Find Usages from the main menu or just press Alt+F7.

    Find tool window

    While in the Find tool window, you can use the Preview area to check the places where the usages were found, to see a call hierarchy for methods, data flow for fields, and so on.

  • To show the search results in a popup, position the caret at the symbol for which you want to find usages and select Edit | Find | Find Usages from the main menu or just press Ctrl+Alt+F7.

    Show usages popup
    Click Open Find Usages Tool window to move the search results to the Find tool window.

  • To view the results of previous Find Usages actions, select Edit | Find | Recent Find Usages from the main menu, and then select the usage query.

Manage the Find Usages scope

If WebStorm doesn't find any usages of a symbol, it displays a message.

Show usages: no results detected

Click Settings or press Ctrl+Shift+Alt+F7 to open the Find Usages dialog and set a new scope for your search, for example, Open Files or Project Test Files.

Find Usages dialog (settings for Find Usages)

To set a custom scope, click the ellipsis icon. When you are done setting a new scope, click Find.

Disable automatic highlighting of usages

When you place the caret at a symbol, the IDE highlights all usages of this symbol in the current file. Use the F3 and Shift+F3 shortcuts to navigate between highlighted symbols.

To disable the automatic highlighting, in the Settings/Preferences dialog (Ctrl+Alt+S), go to Editor | General, and clear the Highlight usages of element at caret checkbox.

When the automatic highlighting is disabled, place the caret at the necessary symbol and press Ctrl+Shift+F7. This will highlight all usages of the symbol in the current file.

Replace the search string in a project

  1. Press Ctrl+Shift+R to open the Replace in Path dialog.

  2. In the top field, enter your search string. In the bottom field, enter your replacement string.

    Replace in path dialog
  3. Click one of the available Replace commands.

Last modified: 17 September 2019