Wie kann ich PHP-Dateien mit HTML-Markup in Visual Studio Code formatieren?

Lesezeit: 6 Minuten

Benutzer-Avatar
progonkpa

Ich benutze Laravel, also sind alle Ansichten .blade.php Dateien. Visual Studio Code formatiert den HTML-Code aufgrund der PHP-Erweiterung nicht. Ich habe den „Blade“-Teil des Dateinamens entfernt, aber die Dateien werden immer noch nicht richtig formatiert (via Alt+Wechsel+F).

Ich habe auch ungefähr fünf Erweiterungen ausprobiert, aber keine von ihnen führt die Neuformatierung durch.

Wie kann ich formatieren .blade.php Dateien in Visual Studio Code?

  • Mögliches Duplikat des Codebefehls VSCode Format für PHP/HTML

    – Cees Timmermann

    2. August 2017 um 9:15 Uhr

  • VS Code verfügt standardmäßig über HTML Intellisense. Um dieses Plugin für Ihr Ziel zu verwenden, gehen Sie zum Hauptmenü – Datei / Einstellungen / Einstellungen und fügen Sie dann in Ihren Benutzereinstellungen Folgendes hinzu: “files.associations”: {“*blade .php”: “html”} Es funktioniert für jede Vorlagenerweiterung, jeden Zweig usw. Es funktioniert auch ohne Neustart des VS-Codes.

    – Winsa

    1. Februar 2018 um 17:12 Uhr

Benutzer-Avatar
Mohammed Allal

Die Erweiterung Verschönern (von HookyQR) macht es einfach sehr gut. Fügen Sie entweder PHP und jeden anderen Dateierweiterungstyp zur Konfiguration hinzu. Wie von Nico gesagt, hier ist ein Beispiel:

  1. Gehen Sie zu den Benutzereinstellungen (Strg + Wechsel + PBenutzereinstellungen (UI) bzw Strg + , (Komma)

  2. Suchen Sie im Feld oben nach Beautify. Und klicken Sie auf “Bearbeiten in settings.json” zum “Verschönern: Konfig”.

  3. Für die “html” Abschnitt, hinzufügen “php” und “Klinge”.

    Geben Sie hier die Bildbeschreibung ein
    Geben Sie hier die Bildbeschreibung ein

###Verwendungszweck

Sie können es direkt aufrufen. Drücken Sie F1und dann schreiben Verschönern. Das automatische Vervollständigung gibt Ihnen zwei Möglichkeiten, “Datei verschönern” und „Auswahl verschönern“. Wählen Sie die, die Sie brauchen, und es wird die Arbeit erledigen. Das ist ein unkomplizierter direkter Weg.

Geben Sie hier die Bildbeschreibung ein

Du kannst auch füge hinzu ein Schlüsselbindung Ein … Haben Tastaturkürzel. So geht’s:

  1. Öffnen Sie keybindings.json (gehen Sie zu menu DateiEinstellungenTastatürkürzel)

  2. Klicken Sie oben hinein. Datei öffnen und bearbeiten keybindings.json

  3. Fügen Sie Folgendes in die geschlossenen Klammern ein, []

    {
           "key": "alt+b",
           "command": "HookyQR.beautify",
           "when": "editorFocus"
    }
    

    Wählen Sie einen beliebigen Schlüssel und stellen Sie sicher, dass Sie keinen vorhandenen überschreiben. Suchen Sie zuerst auf der linken Seite, ob es existiert oder nicht.

    Geben Sie hier die Bildbeschreibung ein

Beachten Sie, dass all diese Dinge in der Beschreibung der Erweiterung gut dokumentiert sind.

Extra: Hinweis zur Klinge

(Suite zur Klarstellung von @Peter Mortensen)

Klinge oder Klinge.php

Wenn Sie verwirrt sind, wenn es ist blade oder blade.php für die Einstellung! Ich kläre es für dich auf! Es ist blade! Das ist das Schlüsselwort vscode für die Sprache!

Woher weißt du das ?

Zuerst, wenn Sie die Liste der Sprachen wie im Bild unten öffnen:

Geben Sie hier die Bildbeschreibung ein

Blatt schreiben

Geben Sie hier die Bildbeschreibung ein

Du kannst sehen Laravel Blade (blade)! Das Sprachschlüsselwort steht in den Klammern! Klinge!

Nun, aber wie zu überprüfen!

Versuche es mit blade.php in den Einstellungen!

Geben Sie hier die Bildbeschreibung ein

Versuchen Sie zu verschönern

Geben Sie hier die Bildbeschreibung ein

Sie erhalten ein gefragtes Kontextmenü für welche Sprache (html, css, js)!

Geben Sie hier die Bildbeschreibung ein

Es geht also nicht!

Wirklich wissen! Zurück geben blade! Und es wirkt und verschönert direkt!

Wie gut es mit Blade funktioniert

Die geniale Antwort darauf! Probieren Sie es aus und überzeugen Sie sich selbst!

Aber wenn du mich fragst! Ich werde sagen, es funktioniert wie mit HTML! Es kann zu praktisch sein! Und Sie müssen möglicherweise einige Linien reparieren! Je nach Ihren Vorstellungen und Ihrem Stil!

Hier eine Illustration! Ich habe die Vertiefung absichtlich verschraubt

Geben Sie hier die Bildbeschreibung ein

Und hier das Verschönerungsergebnis:

Geben Sie hier die Bildbeschreibung ein

  • Dies funktioniert fast gut, es denkt jedoch, dass PHP-Tags HTML-Tags öffnen, und rückt alles darunter ein

    – Brian Leishmann

    30. März 2018 um 21:20 Uhr

  • Ich habe gerade “blade” und nicht “blade.php” hinzugefügt, wie unten von @Sam Dan vorgeschlagen

    – Adrian Smith

    12. Juni 2018 um 12:40 Uhr

  • Bleistiftsymbol, wo?

    – Jonny

    29. Oktober 2019 um 4:56 Uhr

  • @Jonny Dinge haben sich seit dieser Zeit geändert! vscode hat seine Einstellungsverwaltungsoberfläche aktualisiert! Ich werde aktualisieren! Aber was Sie tun müssen, ist CTRL + SHIFT + P > user settings (UI) dann klicken Sie auf edit on settings.json.

    – Mohammed Allal

    29. Oktober 2019 um 19:12 Uhr


  • Sollte "blade" in der Datei „settings.json“ sein "blade.php" oder nicht? Warum oder warum nicht?

    – Peter Mortensen

    13. Juni 2020 um 13:44 Uhr


Benutzer-Avatar
Sam Dan

Verschönern (von HookyQR) löst dieses Problem!

Viele Leute fügen “blade.php” und “php” zur HTML-Konfiguration hinzu. Beautify erkennt eine HTML-Vorlage nicht und wählt sie manuell aus. Stattdessen behebt das einfache Hinzufügen von „blade“ zur HTML-Konfiguration alle Probleme.

  • Ich habe zu meiner Benutzerkonfiguration “beautify.language”: { “js”: { “type”: [ “javascript”, “json”, “jsonc” ]”Dateiname”: [ “.jshintrc”, “.jsbeautifyrc” ] }, “css”: [ “css”, “scss” ]”html”: [ “htm”, “html”, “blade” ] },

    – jmartsch

    28. August 2018 um 18:20 Uhr

  • Bedeutet dies nicht, dass die Blade-Dateien auf “.blade” (und nicht “.blade.php“)?

    – Peter Mortensen

    13. Juni 2020 um 14:03 Uhr


Benutzer-Avatar
Nico

Ich finde Verschönern (von HookyQR) könnte den Zweck erfüllen. Fügen Sie einfach ‚php‘ und/oder ‚blade.php‘ zum HTML-Abschnitt seiner Konfiguration hinzu, um die PHP-/Blade-Ansichtsdateien zu verschönern.

Für mich geht das!

  • Betreff “'blade.php'“: Sollte es nicht einfach sein “'blade'“?

    – Peter Mortensen

    13. Juni 2020 um 13:05 Uhr

  • Warum funktioniert es besser als die anderen Erweiterungen, die das OP ausprobiert hat, wenn es keine direkte Unterstützung dafür gibt? Klinge Dateien?

    – Peter Mortensen

    13. Juni 2020 um 14:00 Uhr

Benutzer-Avatar
rifi2k

Wenn Sie etwas wollen, das sofort einsatzbereit ist, fügen Sie das Format hinzu, das verschachteltes HTML in PHP-Dateien unterstützt, das Visual Studio Code bereits haben sollte.

Es verwendet alle nativen Einstellungen für html.formatbeim Speichern formatieren usw. Geben Sie die Erweiterung an HTML in PHP formatieren ein Versuch. Ich habe es gemacht, weil mich jede andere Lösung genervt hat, weil es nicht 100% funktioniert hat.

Benutzer-Avatar
Andreas Schulz

ich fand diese Erweiterung genannt HTML in PHP formatieren das funktioniert gut für mich.

  • Wiederholung der vorherigen Antwort?

    – Peter Mortensen

    13. Juni 2020 um 13:09 Uhr

Benutzer-Avatar
Peter Mortensen

Andrew Schultz erwähnte die Erweiterung: „HTML in PHP formatieren“.

Dies ist in der Tat eine großartige Erweiterung zum Formatieren von PHP-Dateien mit HTML-Markup. Es formatiert auch JavaScript-Code, der in PHP-Dateien enthalten ist.

Darüber hinaus. Gute Nachrichten! Der Entwickler arbeitet bereits erfolgreich daran, Laravel-blade.php-Dateien einzubinden. In der Zwischenzeit formatiere ich Laravel-Blade-Dateien in Visual Studio Code, indem ich die Sprache manuell umschalte Klinge zu PHP verwende ich dann die Erweiterung “HTML in PHP formatieren” mit Strg + Alt + F oder Rechtsklick. Es funktioniert großartig für mich.

  • Wiederholung der vorherigen Antwort?

    – Peter Mortensen

    13. Juni 2020 um 13:09 Uhr

Benutzer-Avatar
Dharman

Mit einer neuen Funktion in PHP scheint vscode eingebettetes HTML schön zu formatieren und hervorzuheben. (php 7.3, veröffentlicht, nachdem die Frage gepostet wurde) fügt sogenannte “heredoc”- und “neardoc”-Strings hinzu. Hier sind sie gut beschrieben: https://andy-carter.com/blog/what-are-php-heredoc-nowdoc.

Grundsätzlich fügen Sie Ihren HTML-Code wie folgt ein:

[php code.....]
echo
<<<HTML
   <div>
     <h1>This is a headline</h1>
    <p> this is a paragraph. lorem ipsum lorem ipsum blah black </p>
   </div>
HTML;
[^ don't forget the ;  follow with more php if you want]

es sieht einfach toll aus auf dem Bildschirm.

1179430cookie-checkWie kann ich PHP-Dateien mit HTML-Markup in Visual Studio Code formatieren?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy