Visual Studio Code Smart Drupal Snippets

This extension adds rich language support for the Drupal Hooks API and Drupal Form and render elements to VS Code. This extension is intended as a successor to Drupal 8 Snippets.

Usage & Features

Type part of a snippet, press enter and/Or tab, and the snippet unfolds.

Built from Drupal Core

Hooks gathered by scraping the codebase of the latest minor versions of Drupal 9. This includes those that are marked as deprecated.

Smart hook replacement

Snippets will automatically replace the leading hook with the current file's name.

Gif showing usage of hook_views_data snippet

Smart element replacement

Snippets will automatically render the element array base on RenderElement or FormElement. Start by typing @RenderElement, @FormElement, @Element or the [type_name] itself.

FormElement will have #title, #title_display, #description and #required properties by default. Additional properties listed on docblock is generated automatically.

@FormElement

Gif showing usage of form element snippet

@RenderElement

Gif showing usage of render element snippet

@Element

Gif showing usage of form/render element snippet

Typing [type_name]

Gif showing usage of element type snippet

Smart service snippet

While services with global methods allow IDEs to suggest methods and properties, those retrieved using the \Drupal::service() method do not. Service snippets provide a easy access to all core services in a datatyped variable allowing intellisense suggestions.

Services without datatyping

Gif showing intellisense results to un-typed variables

Services with datatyping

Gif showing intellisense results to typed variables

Deprecated services

Gif showing deprecation of a service

Tab Stops

Snippets are formatted to have tab stops on values that need replaced like HOOK, ENTITY_TYPE, BASE_FORM_ID, etc.

Hook Replacement

Gif showing usage of hook_preprocess_HOOK snippet

Element Replacement

FormElement have #title, #title_display (providing default options), #description, #required (TRUE or FALSE) and final ending option of comma ',' or semi-colon ';' as deafult tab stops. Gif showing usage of element snippet tab stops

Services

Services snippets provide a snake-cased, tab-stopped variable matching the service's name. On snippet insertion, the variable can be overwritten easily.

Installation

Open VS Code
From the command palette Ctrl-Shift-P (Windows, Linux) or Cmd-Shift-P (OSX)
Select Install Extension
Search by Drupal Smart Snippets
Click install
Reload Visual Studio Code

Contributions

This project is maintained on Github.

Your bugs, feature requests, and pull requests are welcome.

Drupal Smart Snippets

Andy Blum