Untuk membuat plugin blok untuk WordPress menggunakan Node.js, ikuti langkah-langkah berikut:
1. Instal Node.js dan npm:
- Pastikan Anda telah menginstal Node.js di mesin Anda. Jika belum, unduh dan instal dari situs resmi Node.js[1][2].
2. Siapkan Plugin Blok Pemula:
- Navigasikan ke direktori `wp-content/plugins` dari instalasi pengembangan lokal Anda. Kemudian, jalankan perintah `npx @wordpress/create-block` untuk merancang plugin blok. Perintah ini menghasilkan semua kode yang diperlukan untuk memulai proyek dan mengintegrasikan pengaturan build JavaScript modern tanpa memerlukan konfigurasi[3][4].
3. Konfigurasi Plugin Blok:
- Perintah `buat-blok` meminta Anda memasukkan masukan langkah demi langkah. Anda juga dapat menggunakan mode mulai cepat untuk meneruskan opsi tertentu secara langsung di baris perintah, sehingga menghilangkan kebutuhan akan perintah interaktif[4].
4. Membangun dan Menjalankan Plugin Blok:
- Jalankan `npm start` untuk memulai server pengembangan dan secara otomatis membangun kembali blok setiap kali ada perubahan kode yang terdeteksi. Saat Anda siap menerapkan blok Anda, gunakan `npm run build` untuk mengoptimalkan kode Anda dan membuatnya siap produksi[4].
5. Integrasi dengan WordPress:
- Aktifkan plugin yang dihasilkan di WordPress. Ini akan membuat blok tersedia di Editor[4].
6. Sesuaikan dan Perluas Blok:
- Ubah kode boilerplate untuk menyesuaikan dan memperluas blok sesuai kebutuhan. Hal ini melibatkan penggunaan JavaScript modern (ESNext dan JSX) dan memanfaatkan paket `wp-scripts` untuk tugas build dan linting[4].
Dengan mengikuti langkah-langkah ini, Anda dapat membuat dan mengelola plugin blok khusus untuk WordPress menggunakan Node.js dan paket `@wordpress/create-block`.
Kutipan:[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