Przejdź do treści

Wtyczka Podgląd HTML

Wierny, żywy podgląd aktywnego dokumentu HTML (i PHP), renderowany prawdziwym silnikiem przeglądarkowym (QtWebEngine) w dokowanym panelu. W odróżnieniu od podglądu Markdown renderuje CSS, JavaScript, fonty webowe i wszystko inne dokładnie tak, jak zrobiłaby to przeglądarka.

Komponent opcjonalny

Podgląd HTML linkuje QtWebEngine — ciężką zależność. To build opt-in (MTE_ENABLE_HTML_PREVIEW, domyślnie włączony), obecny tylko, gdy Qt WebEngine jest dostępne. Build bez niego całkowicie pomija tę wtyczkę i nie linkuje QtWebEngine. Zobacz BUILDING.md po notki o pakowaniu i licencjach.

Gdzie go znaleźć

Widok ▸ Podgląd HTML otwiera (lub zamyka) dok podglądu dla bieżącej karty.

Jak się zachowuje

  • Żywy render. Podgląd renderuje się na nowo podczas pisania (z tłumieniem; dla bardzo dużych plików tłumienie się wydłuża).
  • Pełna wierność. Arkusze stylów, skrypty, obrazy i inne zasoby ładują się względem folderu dokumentu, więc strona wygląda jak w przeglądarce.
  • Linki do folderów. Kliknięcie linku wskazującego lokalny folder ładuje dokument indeksu tego folderu (index.html / index.htm / index.xhtml) zamiast listingu katalogu.
  • Otwórz w przeglądarce. Pasek narzędzi otwiera plik z dysku (a dla poniższych trybów serwera PHP — żywy URL) w Twojej domyślnej przeglądarce.

Widoczność podglądu

Widoczność podglądu jest zapamiętywana per plik, zarówno w trakcie sesji, jak i między restartami:

  • Pliki webowe (.html, .htm, .xhtml oraz .php / .phtml / .php3 / .php4) otwierają podgląd automatycznie przy pierwszym wyświetleniu.
  • Inne pliki nie — ale podgląd możesz otworzyć na dowolnym pliku przez Widok ▸ Podgląd HTML, a on wyrenderuje ten plik jako HTML.
  • W ramach sesji Twój wybór dla karty jest przywracany przy powrocie do niej.
  • Między restartami pamiętany jest Twój jawny wybór dla pliku: ręczne zamknięcie pozostaje zamknięte przy następnym otwarciu pliku, a podgląd otwarty na pliku, który sam by się nie otworzył, otwiera się ponownie. Pliki nigdy jawnie nie dotknięte za każdym razem podążają za domyślnym auto-otwieraniem.

Podgląd PHP

PHP działa po stronie serwera, więc QtWebEngine nie może go wykonać wprost. Wybierz obsługę plików .php w Preferencje ▸ Wtyczki ▸ Podgląd HTML:

Tryb Działanie Najlepszy do
Wyłączony Pokazuje stronę z instrukcjami; niczego nie wykonuje ani nie pobiera. Wyłączenia podglądu PHP.
Uruchom przez PHP (wiersz poleceń) Przepuszcza dokument przez lokalny plik binarny php i renderuje wynik. Działa pod CLI SAPI PHP. Szablonów / samodzielnych plików, które wypisują HTML.
Uruchom przez PHP (serwer wbudowany) Serwuje dokument przez wbudowany serwer WWW PHP (php -S), który edytor uruchamia i zatrzymuje za Ciebie. Działa pod web SAPI. Pełnych stron — phpinfo(), $_SERVER, sesje, routing.
Użyj serwera, który sam uruchamiasz (URL) Mapuje otwarty plik na URL na serwerze, który Ty prowadzisz (Apache, nginx, Docker, php artisan serve, …). Istniejącego lokalnego stacka deweloperskiego.

Ścieżka pliku wykonywalnego PHP i Aktualizuj automatycznie podczas pisania dotyczą obu trybów: wiersza poleceń i serwera wbudowanego. Zostaw ścieżkę pustą, aby przeszukać PATH i typowe lokalizacje instalacji (na macOS aplikacja uruchomiona z Findera nie dziedziczy PATH powłoki, więc ustaw pełną ścieżkę, np. /opt/homebrew/bin/php).

Wiersz poleceń kontra serwer wbudowany

Oba tryby uruchamiają lokalny plik binarny php, ale w różnych środowiskach (SAPI), co zmienia to, co działa:

  • Wiersz poleceń (CLI SAPI). Szybko i prosto — pokazuje po prostu to, co skrypt wypisze. Ale phpinfo() renderuje się jako zwykły tekst, a webowe mechanizmy jak $_SERVER, sesje i routing są ograniczone albo puste. Świetny do plików, które głównie emitują HTML.

  • Serwer wbudowany (web SAPI). Edytor uruchamia mały php -S 127.0.0.1:<port> zakorzeniony w folderze pliku i ładuje stronę po HTTP, więc renderuje się dokładnie jak na prawdziwym serwerze: phpinfo() to ostylowana strona HTML, $_SERVER jest wypełnione, sesje i żądania zasobów/podzasobów działają.

  • Serwer startuje dopiero przy pierwszym podglądzie pliku .php w tym trybie, jest współdzielony między renderami, restartowany po przejściu do pliku w innym folderze i zatrzymywany przy zamknięciu edytora lub wyjściu z trybu.

  • Wiąże się tylko z 127.0.0.1, więc nigdy nie jest osiągalny z sieci.
  • Podglądane są też niezapisane zmiany: Twój żywy bufor jest zapisywany do pliku tymczasowego w folderze dokumentu (żeby __DIR__ i względne include/require rozwiązywały się poprawnie) i to on jest serwowany. Plik tymczasowy jest podmieniany przy każdym renderze i usuwany przy wyjściu lub zmianie trybu.

Tip

Jeśli strona PHP pokazuje się jako tekst zamiast wyrenderowanej strony, przełącz się z wiersza poleceń na serwer wbudowany — to różnica CLI-vs-web-SAPI, nie błąd.

Użyj serwera, który sam uruchamiasz (URL)

Jeśli już masz PHP za serwerem WWW, wskaż podglądowi ten serwer:

  • Bazowy URL — korzeń Twojego serwera, np. http://127.0.0.1:8000.
  • Katalog główny dokumentów — lokalny folder serwowany pod bazowym URL. Otwarty plik jest mapowany na URL pod nim. Zostaw puste, aby serwować plik po nazwie z bazowego URL. Jeśli plik leży poza katalogiem głównym, podgląd to zgłasza, żebyś mógł poprawić mapowanie.

Gdy PHP nie zostaje znalezione

W trybach wiersza poleceń i serwera wbudowanego, jeśli nie da się znaleźć pliku binarnego php, podgląd pokazuje krótki błąd wyjaśniający, jak ustawić ścieżkę albo zainstalować PHP. Strona instrukcji trybu Wyłączony także linkuje do pobrań PHP i pokazuje, jak uruchomić serwer.

Zobacz też