Handlebars

screenshot of Handlebars

Fullest Handlebars.js templating support for Sublime Text 2 / 3. Also drives syntax colouring on Github and in Visual Studio Code. Install from: https://packagecontrol.io/packages/Handlebars.

Overview

The Atom and Sublime Text 2/3 Handlebars.js bundle is a package that provides syntax highlighting and key bindings for the Handlebars.js templating engine. It allows for easy development and editing of Handlebars templates in both individual template files and inline templates in script tags. The package also provides tab triggers and key bindings for common Handlebars expressions and comments.

Features

  • Colours of Handlebars expressions are selected to be in contrast with the surrounding HTML
  • Handlebars expressions get syntax highlighting in HTML attributes
  • Parameters passed to block expressions get syntax highlighting too
  • Works both with individual template files and inline templates in script tags
  • Key bindings for Handlebars comments (Sublime only)
  • Tab triggers for common Handlebars expressions such as {{#if}}, {{else}}, {{#unless}}, etc.
  • Tab triggers for partials and script tags with inline templates using recommended data attributes or legacy id attributes

Sublime Text

  1. Install Sublime Package Control by going to the official website (link above) and following the instructions.
  2. After installing Sublime Package Control, press Shift + Cmd + P (OS X) or Shift + Ctrl + P (Windows) to bring up the command palette.
  3. Type "install" to bring up the "Package Control: Install Package" option and press Enter.
  4. Look for "Handlebars" in the list and press Enter to install it.
  5. Choose "Handlebars" in the bottom right corner with one of your template files open. If you have inline templates, use the "Handlebars" syntax instead of HTML.
  6. Profit! Sublime Package Control will automatically update the package from this point on.

Atom

  1. Open Atom.
  2. Go to "Preferences" (or "Settings" on Windows).
  3. Click on "Install" in the left sidebar.
  4. Type "Handlebars" into the search field.
  5. Click the "Install" button next to the "Handlebars" package.
  6. Disable the core "language-mustache" package to ensure that the "Handlebars" package is used automatically with the supported file extensions.

Summary

The Atom and Sublime Text 2/3 Handlebars.js bundle is a package that provides syntax highlighting and key bindings for the Handlebars.js templating engine in both Atom and Sublime Text. It allows for easy development and editing of Handlebars templates, supports both individual template files and inline templates, and provides helpful tab triggers and key bindings for common Handlebars expressions. The package is easy to install and is actively maintained for updates and improvements.

template
Templates & Themes

A template or theme refers to a pre-designed layout or structure that provides a basic framework for building a specific type of application or website. It typically includes good design, placeholder content and functional features, allowing developers to customize and fill in the details according to their specific needs.