VSCode Frontmatter Snippet

Feb 28, 2021

VSCode user snippet to insert YAML frontmatter at the caret position.

Snippet Configuration

Add to Command Palette > Configure User Snippets

"Front Matter": {
    "prefix": "fm",
    "body": [
      "---",
      "title: ${TM_FILENAME_BASE/(^|[ .])([^ .]+)/${1:+ }${2:/pascalcase}/g}",
      "date: ${CURRENT_YEAR} ${CURRENT_MONTH} ${CURRENT_DATE}",
      "description:",
      "categories:",
      "tags:",
      "---",
      "",
    "description": "Add Front Matter"

The Inserted Text

To use the snippet, type fm then TAB. Use in a file named hello world.md to generate the below:

---
title: Hello World
date: 2021 02 28
summary:
categories:
tags:
---
# Hello World

Configuring the Title

"title: ${TM_FILENAME_BASE/(^|[ .])([^ .]+)/${1:+ }${2:/pascalcase}/g}"
  • (^|[ ]) captures start of string or ``/. into Group 1
  • ([^ .]+) captures any 1+ char(s) other than ``and. into Group 2

The ${1:+ }${2:/pascalcase} replacement can be broken down into:

  • ${1: } If Group 1 is not empty, replace the first capture group with ' '.
  • ${2:/pascalcase} Convert Group 2 into title case.

see vscode snippet for additional text replacement

vscode hugo

Related