WebStorm 2016.3 Help

Templates

File | Settings | JavaScript - Templates for Windows and Linux
for OS X
Ctrl+Alt+S

/help/img/idea/2016.3/settings.png

On this page, configure processing of EJS inclusions, Handlebars expressions, and Mustache templates in WebStorm.

ItemDescription
Handlebars/Mustache In this area, configure processing of Handlebars expressions and Mustache templates in WebStorm. The settings specified on this page apply to dedicated Handlebars and Mustache files that have the extension .hbs or .mustache respectively.
  • Automatically insert closing tag:
    • When this check box is selected, WebStorm automatically inserts the second closing curly brace (}) of a Handlebars expression as soon as you type the first closing one.

      WebStorm also recognizes triple stashes ({{{) that prevent escaping values inside expressions. In this case, WebStorm automatically inserts two closing curly braces as soon as you type the first closing one.

    • When this check box is cleared, you have to type the closing curly braces and triple stashes manually.
  • Enable formatting:
    • Select this check box to have Handlebars expressions and Mustache templates automatically reformatted during code generation, refactoring, or reformatting (Ctrl+Alt+L).
    • Clear the check box to have the original formatting of Handlebars expressions and Mustache templates preserved.
  • Open HTML files as Handlebars/Mustache:
    • When this check box is selected, files with the .html extension are treated as Handlebars/Mustache files so WebStorm recognizes and processes Handlebars expressions and Mustache templates. The extensions of files remain unchanged but file names are supplied with the /help/img/idea/2016.3/fileTypeHandlebars.png icons.
    • When this check box is cleared only files with the .hbs extension are treated as Handlebars/Mustache files and Handlebars expressions and Mustache templates within them are recognized and processed.
  • Language for comments: From this drop-down list, select the language to inherit the style for comments from. When you enter a line or block comment by pressing Ctrl+Slash or Ctrl+Shift+Slash, WebStorm inserts the comment delimiters that are used in the chosen language, for example, {{!----}} for Handlebars, /**/ for JavaScript, <!----> for HTML, etc.
For more details about Handlebars expressions and Mustache templates see http://handlebarsjs.com/.

The area is only available when the Handlebars/Mustache plugin is enabled. The plugin is bundled with WebStorm and activated by default. If the plugin is not activated, enable it on the Plugins page of the Settings / Preferences Dialog as described in Enabling and Disabling Plugins.

EJS In this area, specify delimiters for inclusions of EJS in your code. Based on these delimiters, WebStorm will recognize and process such inclusions correctly. A pair of delimiters is also referred to as execute tag.
  • EJS open delimiter: In this text box, type the character string that will indicate the beginning of an EJS inclusion. The default delimiter is <%.
  • EJS close delimiter: In this text box, type the character string that will indicate the end of an EJS inclusion. The default delimiter is %>.

See Also

Last modified: 1 December 2016