VSCode Drupal Coding Standards Setup (From Scratch)

I found this helpful article from drupal.org (https://www.drupal.org/node/2918206) and tried to setup my VSCode to include Drupal Coding Standards from scratch. Here is a detailed approach on how I ended up doing this.

1. Install Dependencies in Your Drupal Project

cd /path/to/your/drupal/project
composer require --dev drupal/coder
./vendor/bin/phpcs --config-set installed_paths vendor/drupal/coder/coder_sniffer

If you are on ddev:

ddev composer require --dev drupal/coder
ddev exec vendor/bin/phpcs --config-set installed_paths vendor/drupal/coder/coder_sniffer

2. Create `phpcs.xml.dist` in Project Root

cat > phpcs.xml.dist << 'EOF'
<?xml version="1.0" encoding="UTF-8"?>
<ruleset name="project">
  <arg name="extensions" value="php,module,inc,install,test,profile,theme"/>
  <rule ref="Drupal"/>
  <rule ref="DrupalPractice"/>
  <file>web/modules/custom</file>
  <file>web/themes/custom</file>
</ruleset>
EOF

3. Install VSCode Extension

Install https://marketplace.visualstudio.com/items?itemName=ValeryanM.vscode-ph…: valeryanm.vscode-phpsab

4. Configure VSCode

Add to your global settings.json:

{
  "phpsab.standard": "Drupal,DrupalPractice",
  "[php]": {
    "editor.defaultFormatter": "valeryanm.vscode-phpsab",
    "editor.formatOnSave": true
  }
}

vscode

drupal