Wstępna konfiguracja motywu

1. Na początek zainstaluj wszystkie potrzebne pakiety poleceniem npm install lub pnpm install, a następnie uruchom pierwszy build poleceniem npm run build lub pnpm build, aby sprawdzić, czy konfiguracja działa.
2. Skopiuj build Pagefind (wyszukiwarka witryny), żeby był dostępny w środowisku deweloperskim. Sposób zależy od Twojego systemu operacyjnego. Przygotowaliśmy kilka poleceń, które w tym pomogą.
   • W systemie Windows uruchom npm run winsearch
   • W systemie OSX lub Linux uruchom npm run osxsearch
3. Następnie skonfiguruj i18n swojej witryny (jeden język albo wiele). Po prostu uruchom polecenie npm run docs:config-i18n i postępuj zgodnie z instrukcjami skryptu!
4. Teraz możesz dostosować witrynę do własnych potrzeb!

Wprowadzenia do kodu

Przygotowaliśmy kilka wycieczek po kodzie, które wprowadzą Cię w tę bazę kodu. Aby obejrzeć je w VSCode lub innym IDE, potrzebujesz rozszerzenia Code Tour.

Struktura kodu

Większość elementów kodu znajduje się w katalogu src/docs. Dzięki temu łatwo przenieść cały ten folder do istniejącego projektu i dodać funkcje dokumentacji w kilka minut.

Opcje konfiguracji

Ogólną konfigurację witryny przeprowadzasz w folderze src/docs/config/. Większość ustawień znajduje się w folderach poszczególnych języków, co ułatwia obsługę tłumaczeń.

Ustawienia witryny

Plik src/docs/config/siteSettings.json.ts służy do konfiguracji ustawień witryny. Obejmują one między innymi to, czy włączyć view transitions, czy włączyć animacje i czy pokazywać przyciski kopiowania linku przy nagłówkach dokumentacji.

Dane witryny

Plik src/docs/config/[language]/siteData.json.ts służy do konfiguracji danych witryny. Obejmują one między innymi tytuł witryny, opis, linki do mediów społecznościowych i domyślny obraz.

Dane nawigacji

Dane nawigacji dla górnego paska skonfigurujesz w pliku src/docs/config/[language]/navData.json.ts.

Układ paska bocznego

Kolejność sekcji dokumentacji skonfigurujesz w pliku src/docs/config/[language]/sidebarNavData.json.ts.

Roboty

Aby roboty takie jak Google widziały właściwą mapę witryny, wskaż w pliku public/robots.txt domenę swojej witryny.

Więcej materiałów

Ogólne informacje o Astro

Astro szuka plików .astro lub .md w katalogu src/pages/. Każda strona jest udostępniana jako trasa na podstawie nazwy swojego pliku.

W katalogu src/components/ nie ma nic szczególnego, ale to właśnie tam umieszczamy komponenty Astro/React/Vue/Svelte/Preact.

Zasoby statyczne, takie jak obrazy, możesz umieścić w katalogu public/. Często korzystamy też z src/assets dla obrazów, gdy używamy Astro assets do optymalizacji obrazów.

Polecenia

Wszystkie polecenia uruchamiasz z katalogu głównego projektu, w terminalu:

Polecenie	Działanie
npm install	Instaluje zależności
npm run dev	Uruchamia lokalny serwer dev na localhost:4321
npm run build	Buduje produkcyjną wersję witryny do ./dist/
npm run preview	Podgląd builda lokalnie, przed wdrożeniem
npm run astro ...	Uruchamia polecenia CLI, np. astro add, astro check
npm run astro -- --help	Wyświetla pomoc do Astro CLI

Chcesz dowiedzieć się więcej?

Zajrzyj do dokumentacji albo dołącz do serwera Discord.