Aby utworzyć wtyczki blokowe dla WordPressa przy użyciu Node.js, wykonaj następujące kroki:
1. Zainstaluj Node.js i npm:
- Upewnij się, że masz zainstalowany Node.js na swoim komputerze. Jeśli nie, pobierz i zainstaluj go z oficjalnej strony Node.js[1] [2].
2. Skonfiguruj wtyczkę bloku startowego:
- Przejdź do katalogu `wp-content/plugins` w lokalnej instalacji rozwojowej. Następnie uruchom polecenie `npx @wordpress/create-block`, aby utworzyć szkielet wtyczki blokującej. To polecenie generuje cały kod niezbędny do uruchomienia projektu i integruje nowoczesną konfigurację kompilacji JavaScript bez konieczności konfiguracji[3] [4].
3. Skonfiguruj wtyczkę blokującą:
- Komenda `create-block` monituje o wprowadzenie danych krok po kroku. Możesz także użyć trybu szybkiego startu, aby przekazać określone opcje bezpośrednio w wierszu poleceń, eliminując potrzebę interaktywnych podpowiedzi[4].
4. Skompiluj i uruchom wtyczkę blokującą:
- Uruchom `npm start`, aby uruchomić serwer programistyczny i automatycznie odbudować blok po wykryciu jakiejkolwiek zmiany w kodzie. Kiedy będziesz gotowy do wdrożenia bloku, użyj `npm run build`, aby zoptymalizować kod i przygotować go do produkcji[4].
5. Zintegruj z WordPress:
- Aktywuj wygenerowaną wtyczkę w WordPress. Spowoduje to udostępnienie bloku w Edytorze[4].
6. Dostosuj i rozszerz blok:
- Zmodyfikuj kod standardowy, aby dostosować i rozszerzyć blok w razie potrzeby. Wiąże się to z użyciem nowoczesnego JavaScript (ESNext i JSX) i wykorzystaniem pakietu `wp-scripts` do zadań kompilacji i lintingu[4].
Wykonując poniższe kroki, możesz tworzyć niestandardowe wtyczki blokowe dla WordPress i zarządzać nimi przy użyciu Node.js i pakietu `@wordpress/create-block`.
Cytaty:[1] https://wpdevelopment.courses/articles/wordpress-create-block/
[2] https://kinsta.com/courses/gutenberg-block-development/setting-up-a-block-plugin/
[3] https://www.npmjs.com/package/%40wordpress/create-block
[4] https://developer.wordpress.org/block-editor/getting-started/devenv/get-started-with-create-block/
[5] https://www.youtube.com/watch?v=-aa4F4Dn9GY