This extension provides Mustache template engine support for Visual Studio Code. It helps you to write your Mustache files with syntax highlighting and code completion.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
This is a Visual Studio Code extension that provides robust support for the Mustache template engine. Simplify your workflow by Mustache file editing with advanced features such as syntax highlighting, code completion, customized snippets, and more!
Requirements
VSCode 1.46.0 or later
Snippets
Type part of snippet, press Tab or Enter, and the snippet unfolds. Below is a list of the most important shortcuts.
Snippet
Purpose
layout
html template
block
{{$ name }} ... {{/ name }}
section
{{# name }} ... {{/ name }}
inverted section
{{^ name }} ... {{/ name }}
comment
{{! comment }}
include
{{> template }}
extends
{{< template }}
Usage
If you want to create a new file, you can select the option Mustache: Generate New Mustache File from the command palette. This will create a new file with the extension .mustache and will open the file in the editor. If you want to create a new file in a specific folder, you can right-click on the folder and select the option Generate New Mustache File. This will create a new file with the extension .mustache in the selected folder and will open the file in the editor.
If you want to change the delimiters, you can select the template section and then select the Mustache: Change Delimiters option from the command palette. This will open a dialog box where you can enter the delimiters currently used in the template and the extension will replace the delimiters of the selected section. For example, if you select the section {{# name }} ... {{{/ name }} and you need to change the delimiters to [[ and ]], you can select the Change delimiters option and this will change the section to [[# name ]] ... [[/name ]].
Project Settings
Configure your project by creating or updating a settings.json file at the project's root. If you already have a .vscode/settings.json file, skip the first two steps.
Open the command palette in VSCode:
CTRL + SHIFT + P (Windows)
CMD + SHIFT + P (Mac OS)
Type Preferences: Open Workspace Settings (JSON).
In the .vscode/settings.json file, copy and paste the following settings:
{
// The delimiters option can be used to change the current template delimiters when generating a new file.
// Syntax highlighting or snippets included in the extension will not be affected by this setting.
"mustache.delimiters": {
"left": "{{",
"right": "}}"
}
}
Restart VS Code
Your project is now set up to automatically format code upon saving.