Set file type associations
WebStorm recognizes a default set of file types. Such files are parsed and highlighted according to the syntax of the corresponding languages.
If you are working with a file type that WebStorm does not recognize (for example, if it's a proprietary in-house developed file type) you can also create a custom file type.
You can configure how the IDE will parse the files by defining highlighting schemes for keywords, comments, numbers, and so on. You can also associate each file type with an extension to help the IDE identify the files of the custom formats.
Create a new file type
Press Ctrl+Alt+S to open IDE settings and select Editor | File Types.
In the Recognized File Types section, click
, specify the name of the new type, and provide a description.In the Syntax Highlighting section, configure case sensitivity, brace matching settings, and specify ways of defining comments:
Line comment: specify characters that indicate the beginning of a single-line comment.
Only at line start: characters that indicate the beginning of a line comment are recognized as a comment if they are located in the beginning of a line.
Block comment start, Block comment end: specify characters that indicate the beginning and the end of a block comment.
Hex prefix: specify characters that indicate that the subsequent value is a hexadecimal number (for example,
0x).Number postfixes: specify characters that indicate which numeric system or unit is used. A postfix is a trailing string of characters (for example,
e-3, kg).Support paired braces, Support paired brackets, Support paired parens, Support string escapes: select these checkboxes to highlight paired braces, brackets, parentheses, and string escapes.
In the Keywords section, you can specify up to four lists of keywords. Keywords of each list will be highlighted differently in the editor and will be auto-completed.
The Ignore case checkbox indicates whether the language in files of the custom format is case-sensitive.
Configure shebang commands for file types
WebStorm can recognize file types by the path specified on the shebang line, mark files with corresponding icons regardless of their extensions, and provide language-aware syntax highlighting. A shebang is a combination of characters in a script file followed by a path to the interpreter program that should execute this script. It starts with #! and it's always located on the first line of a script file.
Press Ctrl+Alt+S to open IDE settings and select Editor | File Types.
From the Recognized File Types list, select the file type for which you want to configure a command.
In the HashBang patterns area, click
(Add HashBang Pattern).In the dialog that opens, specify the path to the interpreter and click OK.
Apply the changes and close the dialog.
Register a new file type association
If WebStorm cannot identify the type of the file that you are trying to open or create, it shows you the Register New File Type Association dialog in which you can choose the way you want to process this file.
If the dialog doesn't appear automatically, right-click the necessary file in the Project tool window and select Associate with File Type from the context menu. Alternatively, select the file in the Project tool window and go to .
In the Register New File Type Association dialog, select the necessary options:
From the File pattern list, select whether you want to specify a type for the current file (file.extension) or for all files with this extension (*.extension).
Select one of the following options:
Open matching files as text and auto-detect file type by content: open the file without an extension as a text file and identify its type by the content, for example, by the shebang line.
Open matching files in WebStorm: associate the file with one of the existing file types. You can change this association later in the settings.
Open matching files in associated application: open the file in the default application. For example, PDF files are opened in the default PDF viewer. The default application is configured in your system systems.
You can find all extensions associated with external applications in the Files opened in associated applications list in .
There, you can also associate file types with WebStorm to open the selected types of files in the IDE by default.
Click OK to apply the settings.
Change a file type association
You can associate a file type with another extension, a file, or a group of files or remove an association.
Press Ctrl+Alt+S to open IDE settings and select Editor | File Types.
From the Recognized File Types list, select the file type that you want to associate with another extension or a group of files.
Use the File name patterns section to make the necessary changes. You can add a new pattern (
), remove an existing one (
), or modify an existing pattern (
).
Open files in WebStorm by default
You can make WebStorm the default application for opening specific file types. The IDE remembers these associations and automatically applies them to the next WebStorm instance when you upgrade to a newer major version.
Press Ctrl+Alt+S to open IDE settings and select Editor | File Types.
Click the Associate File Types with WebStorm button and select the file extensions you want to open with the IDE in the dialog that opens.
Click OK and close the dialog.
If you're using macOS, restart your computer to apply the changes.
Ignore files and folders
In WebStorm, there's a list of files and folders that are completely excluded from any kind of processing. Out of the box, this list includes temporary files, service files related to version control systems, and so on:
Modify the list of ignored files and folders
Press Ctrl+Alt+S to open IDE settings and select Editor | File Types.
Switch to the Ignored Files and Folders tab.
You can add a new extension (
), remove an existing one (), or modify an existing extension ().Apply the changes and close the dialog.
