VSCode tipp: Quickly navigate to snippet() includes

The CMS Solutions
,
1

…today I was about to write a VSCode Extension, because I was missing functionality that isn’t there out of the box: Open a snippet by clicking the parent <?php snippet() ?> tag.

In the process I found regex-robin.

Regex Robin is a VS Code extension that allows you to customize the appearance of text in your editor using regex patterns, as well as creating links and hover messages.

It’s possible to configure it to check for snippet() calls in PHP files, highlight them and make them clickable to navigate to it’s content (press ALT to open in split view).

"regexrobin.rules": [
    {
      "regex": "snippet\\(['\"]([^'\"]+)['\"]",
      "languages": ["php"],
      "editor": [
        {
          "link": "${workspaceFolder}/site/snippets/$1.php",
        },
      ],
    },
  ],

Maybe it helps someone else.

Tschüss,

Hans

2

…another one for navigating Blueprints that extend.

{
  "regex": "extends:\\s+([^\\s#]+)",
  "languages": ["yaml"],
  "editor": [
    {
      "link": "${workspaceFolder}/site/blueprints/$1.yml"
    }
  ]
}

This is what it looks like. Underline indicates that this can be clicked an navigates to the corresponding yml
This is what it looks like. Underline indicates that this can be clicked an navigates to the corresponding yml644×462 26.6 KB

3

Ah, that’s so cool!

The extends: rule misses the shorthand so I added this:

{
  "regex": "\\w[\\w-]*:\\s+((?:fields|sections|pages|files)/[\\w/-]+)",
  "languages": ["yaml"],
  "editor": [
    { "group": 1, "link": "${workspaceFolder}/site/blueprints/$1.yml" }
  ]
}

I limited it to the common blueprint folders so it doesn’t underline unrelated key: some/value stuff.