Wir haben also die Grundlagen in Visual Studio Code eingerichtet, aber wir haben keine praktischen Tools installiert, die uns bei der professionellen Seite des Codeschreibens helfen.

Natürlich kann „professionell” anhand des Unternehmens, des Teams oder der Umgebung definiert werden, in der Sie arbeiten. Für diese Serie habe ich mich für WordPress als Grundlage entschieden. Aber das lässt noch Dinge übrig wie:

• Kodierungsstandards,
• JavaScript-Linting,
• Paketverwaltung,
• Usw.

Und während der gesamten Serie werde ich alles, was oben aufgeführt ist, behandeln. Aber dazu werde ich jede Komponente einzeln behandeln.

Der heutige Beitrag wird sich auf die PHP-Codierungsstandards konzentrieren. Ich habe viel Material über die WordPress-Codierungsstandards geschrieben, aber im letzten Jahr oder darüber hinaus habe ich begonnen, mehr mit PSR zu arbeiten, und das wird in diesem Beitrag behandelt.

Als Randnotiz sollten Sie wissen, dass vieles von dem, was behandelt wird, in die WordPress-Codierungsstandards übersetzt werden kann, falls Sie dies wünschen, und es wird klar sein, wo Sie die Änderungen vornehmen würden.

Lassen Sie uns damit beginnen.

PHP-Codierungsstandard in Visual Studio Code

Stellen Sie zunächst sicher, dass Sie die Voraussetzungen erfüllen, die alle in früheren Posts dieser Serie behandelt wurden. Nämlich:

1. Eine IDE für die WordPress-Entwicklung
2. Arbeiten mit Benutzereinstellungen in Visual Studio Code

Jeder der oben genannten Schritte führt Sie durch das Einrichten, Konfigurieren und Verwalten von Visual Studio Code und die Grundlagen zum Verständnis von Benutzereinstellungen (zusammen mit bevorzugten Schriftarten und dergleichen).

Und damit ist es an der Zeit, Unterstützung für Code-Sniffing und Regeln für PHP-Codierungsstile basierend auf PSR-2 zu installieren .

Bevor Sie Code mitteilen, dass Sie diesen bestimmten Regelsatz verwenden möchten, können Sie Ihrer Einstellungsdatei einige Dinge hinzufügen.

1 Eine Aktualisierung Ihrer Benutzereinstellungen

Denken Sie daran, dass Sie zum Aktualisieren Ihrer Benutzereinstellungen einfach auf Code klicken und dann zu Einstellungen navigieren oder die Tastenkombination Cmd+ (oder das Äquivalent auf Ihrem Betriebssystem) verwenden können.

Dies öffnet ein vertrautes Fenster:

Geben Sie als Nächstes den folgenden Befehl in Ihrem Terminal aus:

$ brew install php-code-sniffer

Beachten Sie, dass ich es bereits installiert habe, wenn ich dies tue, aber ich werde aufgefordert, ein Upgrade durchzuführen (das habe ich).

Und dann können Sie darin die folgenden Zeilen zu Ihrer Benutzereinstellungsdatei hinzufügen :

{
  // ...

  // PHP Settings.
  "php.suggest.basic": true,
  "php.validate.executablePath": "/usr/local/bin/php",
  "php.validate.run": "onSave",

  // ...
}

Wenn Sie den Pfad zu Ihrer lokalen PHP-Installation nicht kennen, können Sie den folgenden Befehl in Ihrem Terminal ausführen:

$ which php

Hier ist, was jede Zeile beschreibt:

1. php.suggest.basic. Dies steuert, ob die IDE selbst Vorschläge für PHP-basierten Code macht oder nicht (was beim Schreiben von Code hilfreich ist). Betrachten Sie dies als automatische Vervollständigung, einen Blick in die API oder wie auch immer Ihre aktuellen oder früheren IDEs es nennen mögen.
2. php.validate.executablePath. Dies verweist einfach auf die PHP-Binärdatei auf der Festplatte. Dies ist nützlich, damit es die Version von PHP ausführt, mit der Ihre Projekte ausgeführt werden.
3. php.validate.run. Wie Sie vielleicht erwarten, validiert dies Ihren Code, wenn Sie Ihre Datei speichern. Sie können dies während der Eingabe tun, aber abhängig davon, wie viel Sie tippen, wie schnell Sie tippen oder nur von der Art Ihrer Gewohnheiten, kann es einfacher sein, dies auf Speichern zu tun ( daher verwende ich es anstelle der Alternative was onType ist ).

All dies ist meiner Meinung nach nett und notwendig, aber es bringt uns kein Code-Sniffing. Wenden wir uns also jetzt dem zu.

2 Hinzufügen von Code-Sniffing

Erinnern Sie sich an den vorherigen Abschnitt, ich habe PHP Code Sniffer über Homebrew installiert, aber wie fügen wir Unterstützung über Visual Studio Code hinzu?

Ich meine, es hat seinen eigenen Marktplatz, wo wir es hinzufügen können, aber gibt es andere Dinge, die wir tun können? Da wir es über Homebrew installiert haben, ist es erledigt.

Jetzt geht es darum, es an Code zu binden. Es geht darum, zwei Dinge zu tun:

1. Installieren eines Plugins in Code,
2. Aktualisieren Sie Ihre Benutzereinstellungen (erneut).

Navigieren Sie zuerst zum Plugins-Bildschirm in Code und suchen Sie dann nach phpcs. Sie sollten so etwas wie das Folgende sehen:

Klicken Sie auf Installieren und dann auf Neu laden, wenn Sie dazu aufgefordert werden.

Als nächstes besuchen wir noch einmal unsere Einstellungsdatei und fügen Folgendes hinzu:

{
  // ...

  // PHP Coding Standards.
  "phpcs.enable": true,
  "phpcs.executablePath": "/usr/local/bin/phpcs",
  "phpcs.standard": "PSR2"

  // ...
}

An diesem Punkt sind Sie mit der Konfiguration der PSR-2-PHP-Codierungsstandards mit Visual Studio Code vollständig fertig.

3 Jetzt testen

Um zu sehen, ob alles richtig funktioniert, öffnen Sie eine beliebige PHP-Datei – entweder eine aus einem Projekt, an dem Sie arbeiten, oder eine aus dem WordPress-Kern. Öffnen Sie das integrierte Terminal. Da der WordPress-Kern nicht PSR-2 folgt, werden Sie wahrscheinlich viele Fehler sehen.

Sehen Sie sich die Registerkarte „ Probleme ” im Terminal an und beachten Sie Folgendes:

Natürlich soll dies WordPress nicht tadeln. Stattdessen soll es zeigen, dass Sie, wenn Sie ein Problem von PHP Code Sniffer sehen, es beheben können, bevor Sie die Datei tatsächlich speichern, die Datei vervollständigen oder die Datei in das Repository übertragen.

Was ist mit Front-End-Arbeit?

So wichtig es auch ist sicherzustellen, dass unser Code der richtigen Qualität der serverseitigen Arbeit entspricht, was ist mit CSS (oder Sass oder LESS) oder JavaScript?

Es gibt auch spezielle Tools dafür, und wir werden dieses Material im nächsten Beitrag weiter behandeln.

Konzentrieren Sie sich vorerst darauf, PHP-Codierungsstandards im Code einzurichten, sehen Sie sich an, was Sie besser machen können, um Ihre Stile zu verbessern, und wir machen von dort aus weiter.