Ubuntu 20.04, WSL2, VSCode a Drupal 8 – Oprava „Gotchas“

Microsoft konečně dodal fantastické řešení pro vývoj linuxových aplikací na Windows. Subsystém Windows pro Linux, WSL2, se poměrně snadno instaluje a nastavuje, zvláště pokud jste již obeznámeni s Linuxem. I když ne, existuje mnoho velmi dobrých článků o tom, jak zprovoznit a spustit základní instalaci.

Vývoj aplikací Linux PHP pomocí VSCode na Windows 10 je zhruba tak stabilní a bezproblémový, jak jen může být. Přesto žádný z článků o nastavení LAMP na Ubuntu a WSL2, které jsem našel, nepopsal několik „dopadů“, se kterými jsem se setkal.

Měl jsem omezené zkušenosti s Linuxem a hodně jsem závisel na článcích napsaných těmi, kteří byli přede mnou. Zatímco mě dostali většinu cesty tam, narazil jsem na několik problémů, jak Drupal 8 fungovat bez chyb a ladění ve VSCode. Řešení byla nalezena v komentářích k otázkám zveřejněným na internetu. Trvalo to mnoho hodin hledání a doufám, že zachráním lidi tím, že představím řešení, která jsem našel v tomto jednom článku.

Moje prostředí je Windows 10 20H2, Ubuntu 20.04, PHP 7.3, MariaDB 10.4.17, Drupal 8.9.13, Xdebug 3.02, Windows Terminal, VSCode s Remote – WSL a balíčky PHP Debug Felix Becker. Používám WSL z Powershell ve Windows Terminal.

Než začneme, zde je několik doporučení, která vám mohou ušetřit čas.

Instalace a používání apt-fast místo apt může skutečně urychlit instalace a aktualizace. Tam, kde žiji, má internet malou šířku pásma a je pomalý a apt-fast je mnohem rychlejší než apt.

Svou linuxovou distribuci můžete „zálohovat a obnovit“ pomocí exportu a importu WSL. Jako u každého systému je vhodné udržovat vždy aktuální zálohu.

Mariadb se nainstaluje v pořádku, ale nelze jej restartovat ani získat stav

Instalace Mariadb proběhla v pořádku. Žádné chyby ani varování. Když jsem se pokusil zkontrolovat stav, zobrazila se mi chyba o systému.

$>systemctl-status mysql

Systém nebyl zaveden pomocí systemd jako init-systém (PID 1). nemusí fungovat.

Důvodem této chyby je, že společnost Microsoft nepodporuje systemd ve WSL. Naštěstí společnost Arkane Systems vytvořila balíček nazvaný System Genius, který umožňuje systemd. Před vyzkoušením níže uvedených pokynů, extrahovaných z této stránky, doporučuji důkladně pročíst jejich webovou stránku. Pokyny pro distribuce mimo Ubuntu se mírně liší.

Nejprve musíte nainstalovat runtime .Net 5.0

$>rychlá aktualizace sudo apt

$>sudo sudo apt-rychlá instalace -a apt-transport-https

$>rychlá aktualizace sudo apt

$>sudo apt-quick install -and dotnet-sdk-5.0

Dále musíme nakonfigurovat repozitář wsl-transdebian

$>sudo apt-quick Nainstalujte apt-transport-https

$>wget -Ö /etc/suitable/Trusted.gpg.d/wsl-transdebian.gpg https://arkane-systems.github.io/wsl-transdebian/suitable/wsl-transdebian.gpg

$>chmod a+r /etc/suitable/Trusted.gpg.d/wsl-transdebian.gpg

$>Kočka << EOF > /etc/suitable/Quellen.liste.d/wsl-transdebian.list

$>deb-https://arkane-systems.github.io/wsl-transdebian/suitable/ bullseye main

$>deb-src https://arkane-systems.github.io/wsl-transdebian/suitable/ bullseye main

$>apt-rychlá aktualizace

Nyní můžeme nainstalovat balíček System Genius.

sudo apt-rychlá instalace a systemd-genius

Ukončete linuxový shell a poté vypněte WSL pomocí power shell

PS C:UsersUsername>wsl - vypnout

Restartujte WSL pomocí džina z příkazového řádku powershell.

PS C:Uživatelské jméno>wsl-genie –p

Uvidíte "Waiting for systemd....!!!!!!!!!!!!!!!!". Plné nabití trvá 180 sekund. Jen počkejte, až to skončí. Po dokončení by vaše nové okno shellu mělo vypadat takto:

Čekání na systemd....!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Vypršel časový limit, aby systemd vstoupil do běžícího stavu.

To může znamenat chybu konfigurace systemd.

Zkuste pokračovat.

Potvrďte, že je genie nainstalováno a systemd funguje:

systemctl-status mariadb

Měli byste získat stavový výstup pro mariadb. Všimněte si, že systemctl status mysql také funguje.

Společnost Arkane Systems doporučuje ukončit relaci WSL Genie pomocí wsl --shutdown. To uvolní veškerou paměť používanou WSL ve Windows.

Drupal nainstalován, ale nenačítá se CSS

Po základní instalaci Drupalu 8 neměly stránky žádné formátování. Zobrazení zdroje stránky ukázalo, že nebyly načteny žádné soubory CSS. Trvalo mi dva dny, než jsem na to přišel, ale krátký příběh je, že Drupal předpokládá, že Apache2 používá adresář /tmp, ale není tomu tak. Ve výchozím nastavení je Apache2 nakonfigurován tak, aby používal soukromý adresář tmp. Je zvláštní, že volání PHP sys_get_temp_dir() vrací /tmp, ale to není to, co Apache2 používá. Když Drupal vytvoří své optimalizované soubory css a js, nejprve se je pokusí zapsat do složky /tmp a poté je přesune do cílové složky, obvykle sites/default/files/css a /js. Ale apache2 nepoužívá /tmp, takže tato operace selže a žádný ze souborů css nebo js. Vypnutím Aggregate CSS a Javascript souborů to půjde obejít, ale pak se načtou všechny jednotlivé CSS a js soubory, takže to není řešení.

Tento problém můžete potvrdit pomocí následujícího jednoduchého souboru PHP, který /tmp není přístupný. Vytvoří tmpfile a zobrazí název souboru. Zpočátku je název souboru prázdný, protože volání tmpfile() vrací NULL. Vložil jsem následující kód do test.php a zavolal jsem ho z mého webu, localhost/mysite/test.php

Echo "n";

Echo "n";

Echo “ n";

Echo "n";

Echo "n";

Echo “

Pokud zobrazíte zdrojový kód stránky Rn, v tomto řetězci najdete nový řádek.";

Echo “

Test

“;

$tmpDir =sys_get_temp_dir();

Echo “

Adresář TMP ='$tmpDir'

“;

$file =tmpfile();

$path =stream_get_meta_data($file)['uri'];

Echo “

Cesta k souboru tmp=”$cesta”

“;

Echo "n";

Echo "n";

?>

Výsledkem je „Cesta k souboru tmp =“

Našel jsem řešení v komentářích otázky Stackoverflow uživatele One In a Million Apps. Toto řešení mění konfiguraci Apache2 z PrivateTmp=true na PrivateTmp=false. Všimněte si, že změna Apache2 na používání soukromého adresáře tmp byla provedena z bezpečnostních důvodů a většinu aplikací lze nakonfigurovat tak, aby používala jinou složku tmp. Zkoušel jsem to s Drupalem, ale nepodařilo se mi to spustit. Toto je můj první pokus o spuštění Drupalu na Linuxu a chtěl jsem, aby věci na mém notebooku „prostě fungovaly“ bez obav o bezpečnost.

Nejprve vyhledejte soubor obsahující PrivateTmp v adresáři /lib:

%>sudo find/mount -type F -exec grep -e “PrivateTmp” ‘{}’ ‘;’ -print

To mi dalo dlouhý seznam zápasů. Vyhledejte soubor, který obsahuje soubor apache2.service. V mém případě to bylo nalezeno na /usr/lib/systemd/system/apache2.service. zkopírujte tento soubor do /etc. Adresář. Upravte /etc/apache2.services a změňte PrivateTmp=true na PrivateTmp=false, uložte a restartujte službu Apache2.

systemctl restartujte apache2

Spusťte znovu stránku test.php a měli byste vidět soubor tmp s názvem potvrzující přístup ke složce /tmp.

Vymažte všechny mezipaměti Drupalu a znovu načtěte stránky. Nyní by se měly zobrazovat správně. Nevím proč, ale funkce Drupal Clear Cache mi ne vždy funguje. Ruční smazání všech souborů v sites/default/files/css js a následné vymazání tabulek mezipaměti pomocí PhpMyAdmin vždy funguje.

Nastavte ladění VSCode

Konfigurace Xdebug

Nejprve nainstalujte balíčky Remote – WSL a PHP Debug od Felixe Beckera ve VSCode.

Poté jsem nainstaloval Xdebug

sudo apt-fast php7.3-xdebug

Toto nainstalovalo verzi 3.02 Xdebug.

Zkusil jsem to nakonfigurovat podle mnoha příkladů na webu. Nic nefungovalo. Ukázalo se, že většina příkladů je pro Xdebug 2.xa tato konfigurační nastavení již nefungují s 3.x

Konečně jsem to zprovoznil s následujícím nastavením php.ini.

Potřeboval jsem přidat následující do obou /etc/php/7.3/apache2/php.ini a /etc/php/7.3/cli/php.ini v mém systému

Umístění vašeho xdebug.so můžete najít tak, že přejdete do souboru adresáře /lib a spustíte

find -name xdebug.so [xdebug]

zend_extension =./lib/php/20180731/xdebug.so

xdebug.start_with_request =Spouštěč

xdebug.mode =debug

xdebug.discover_client_host =1

xdebug.log =/tmp/xdebug_remote.log

xdebug.client_port =9003

Nakonfigurujte VSCode

Vzdálené ladění ve VSCode používá soubor launch.json uložený v kořenovém adresáři vašeho projektového adresáře v .vscode/launch.json.

Soubor launch.json můžete vytvořit pomocí uživatelského rozhraní VSCode, ale zdá se mi jednodušší ho vytvořit ručně. Přejděte do kořenového adresáře svého webu a vytvořte adresář .vscode. Vytvořte soubor launch.json a načtěte jej do VSCode.

$>mkdir .vscode

$>CD .vscode

$>dotkněte se launch.json

$>code launch.json

Vložte následující json do souboru a uložte.

{

// Pomocí IntelliSense se dozvíte o možných atributech.

// Umístěním kurzoru zobrazíte popisy existujících atributů.

// Další informace naleznete na adrese:https://go.microsoft.com/fwlink/?Links=830387

"Provedení":"0.2.0",

“Konfigurace”:[

{

„name“:„Listen for XDebug“,

„type“:„php“,

„požadavek“:„spustit“,

"port":9003,

„stopOnEntry“:true,

„log“:true,

"pathMappings":

{

„/var/www/html“:„${workspaceRoot}“

}

},

{

„name“:„Spustit aktuálně otevřený skript“,

„type“:„php“,

„požadavek“:„spustit“,

„program“:„${file}“,

"cwd":"${fileDirname}",

"port":9003

}

]

}

Všimněte si, že pod pathMappings, kde mám "/var/www/html", byste měli zadat úplnou cestu ke kořenovému adresáři vašeho webu.

Zavřete VSCode. V příkazovém řádku WSL Linux přejděte zpět do kořenového adresáře svého webu a načtěte projekt do VSCode. Za předpokladu, že jste stále v adresáři .vscode,

$>CD ..

$> zakódovat.

To by mělo načíst projekt do VSCode a vlevo byste měli vidět úplnou adresářovou strukturu vašeho projektu. Otevřete úvodní stránku, např. B. index.php a přidejte bod přerušení. Stisknutím klávesy F5 spusťte ladění. Přejděte do webového prohlížeče a načtěte stránku. Přepněte zpět na VSCode a měli byste vidět, že se zastavil na vašem bodu přerušení.

Kód nefunguje s prostředím zsh

Ve výchozím nastavení je WSL nastaveno tak, aby pracovalo s bash shellem a vidí cestu ke spustitelnému souboru VSCode v PATH. Přešel jsem na zsh a VSCode přestal běžet. Řešením bylo vložit alias do .zshrc. typ

$>CD ~

$>Code .zshrc

Přidejte následující alias ukazující na úplnou cestu ke složce spustitelného kódu, jak je vidět z Ubuntu ve WSL. Nahraďte YourUserName svým skutečným uživatelským jménem Windows.

alias Code="/mnt/c/Users/YourUserName/AppData/Local/Programs/MicrosoftVSCode/bin/code"

Nyní musíte znovu načíst konfiguraci zsh pomocí

$>zdroj .zshrc

Kód by se nyní měl načíst ze shellu zsh.

A je to!! Tyto kroky mi konečně umožnily ladění Drupalu a VSCode správně. Trvalo mi dva dny, než jsem na to všechno přišel. Jsem noob! Doufám, že to pro vás bude fungovat a ušetří vám čas.

Jen vzpomínka na mé okolí. Windows 10 20H2, Ubuntu 20.04, PHP 7.3, MariaDB 10.4.17, Drupal 8.9.13, Xdebug 3.02, Windows Terminal, VSCode s Remote – WSL a balíčky PHP Debug Felix Becker.

Hodně štěstí při kódování!