Prvotní nastavení šablony

1. Na začátek nainstalujte všechny potřebné balíčky příkazem npm install nebo pnpm install a poté spusťte první build příkazem npm run build nebo pnpm build, abyste ověřili, že nastavení funguje.
2. Zkopírujte build nástroje Pagefind (vyhledávání na webu) tak, aby byl dostupný ve vývojovém prostředí. Postup se liší podle operačního systému. Připravil jsem k tomu několik příkazů.
   • Ve Windows spusťte npm run winsearch
   • V OSX nebo Linuxu spusťte npm run osxsearch
3. Dále budete chtít nastavit i18n pro svůj web (jeden jazyk, nebo více jazyků). Stačí spustit příkaz npm run docs:config-i18n a řídit se pokyny skriptu!
4. Teď si můžete web nastavit podle svých představ!

Úvody do kódu

Připravil jsem několik prohlídek kódu, které Vás uvedou do kódové základny. K jejich zobrazení ve VSCode nebo v jiném IDE potřebujete rozšíření Code Tour.

Struktura kódu

Kód je uspořádán tak, že většina položek leží v adresáři src/docs. Díky tomu lze celou složku snadno vložit do existujícího projektu a během několika minut přidat funkce dokumentace.

Možnosti konfigurace

Celková konfigurace webu se provádí ve složce src/docs/config/. Většina nastavení je uvnitř jednotlivých jazykových složek, aby se s překlady pracovalo snadněji.

Nastavení webu

Soubor src/docs/config/siteSettings.json.ts slouží ke konfiguraci nastavení webu. Patří sem například to, zda zapnout view transitions, zda zapnout animace a zda u nadpisů dokumentace zobrazovat tlačítka pro kopírování odkazu.

Data webu

Soubor src/docs/config/[language]/siteData.json.ts slouží ke konfiguraci dat webu. Patří sem například název webu, popis, odkazy na sociální sítě a výchozí obrázek.

Data navigace

Data navigace pro horní lištu nastavíte v souboru src/docs/config/[language]/navData.json.ts.

Rozvržení postranního panelu

Pořadí sekcí dokumentace nastavíte v souboru src/docs/config/[language]/sidebarNavData.json.ts.

Roboti

Aby roboti jako Google viděli správnou mapu webu, upravte soubor public/robots.txt tak, aby používal doménu Vašeho webu.

Další zdroje

Obecné informace o Astro

Astro hledá soubory .astro nebo .md v adresáři src/pages/. Každá stránka je zpřístupněna jako cesta odvozená z názvu souboru.

Na složce src/components/ není nic zvláštního, ale právě sem rádi ukládáme komponenty Astro/React/Vue/Svelte/Preact.

Statické soubory, například obrázky, můžete umístit do adresáře public/. Často také používám src/assets pro obrázky, když využívám Astro assets k optimalizaci obrázků.

Příkazy

Všechny příkazy se spouštějí v terminálu z kořene projektu:

Příkaz	Akce
npm install	Nainstaluje závislosti
npm run dev	Spustí lokální vývojový server na localhost:4321
npm run build	Sestaví produkční web do ./dist/
npm run preview	Zobrazí náhled buildu lokálně před nasazením
npm run astro ...	Spustí příkazy CLI jako astro add, astro check
npm run astro -- --help	Zobrazí nápovědu k Astro CLI

Chcete se dozvědět více?

Podívejte se na dokumentaci nebo se připojte na Discord server.