Gulp | Langkah Mudah Pengaturan Projek dengan Gulp
Langkah Mudah Pengaturan Projek dengan Gulp
owin
---
Solvedia - Sebelumnya telah kita bahas mengenai Instalasi Gulp dan juga Apa itu Gulp? Selanjutnya akan kita bahas mengenai pangaturan projek dengan Gulp.
Langsung saja kita menuju tekape.
Sebelumnya : Langkah Mudah Instalasi Gulp
Pengaturan Projek Gulp
Buat satu folder khusus untuk gulp, kita beri contoh gulpku.
Terlihat ada perintah npm init yang digunakan untuk membuat file package.json. File ini berisi informasi metadata tentang projek seperti deskripsi, versi, dan module yang akan digunakan dalam project, dsb. Isi package.json kira-kira seperti berikut :
Kemudian buat filebaru dengan nama gulpfile.js, di dalam folder yang sama.
Sejauh ini sudah ada 2 file di dalam folder project yaitu package.json dan gulpfile.js. Now, buka kembali terminal untuk menginstal gulp. Lho bukannya tadi sudah ya?? Yups, yang sebelumnya di instal secara global kalau yang sekarang secara lokal. kenapa mesti dua kali? Nanti akan di jelaskan pada tulisan berikutnya, penasaran ya..... :)
Sampai disini akan tercipta folder baru node_modules. Folder ini digunakan sebagai tempat module node yang di install melalui npm. Nah sekarang kita coba eksekusi task yang ada di gulpfile.js
Nah, sampai disini pengaturan projek gulp sudah selesai, selanjutnya kita akan mencoba membuat struktur folder. Tapi jika sobat masih penasaran kenapa gulp harus diinstall 2 kali (global dan lokal), yuk kita lihat jawabanya:
Nah, Hal yang pertama kita lakukan adalah membuat struktur folder dalam manage projek gulp, terlihat seperti gambar berikut :
Sejauh ini sudah ada 2 file di dalam folder project yaitu package.json dan gulpfile.js. Now, buka kembali terminal untuk menginstal gulp. Lho bukannya tadi sudah ya?? Yups, yang sebelumnya di instal secara global kalau yang sekarang secara lokal. kenapa mesti dua kali? Nanti akan di jelaskan pada tulisan berikutnya, penasaran ya..... :)
Sampai disini akan tercipta folder baru node_modules. Folder ini digunakan sebagai tempat module node yang di install melalui npm. Nah sekarang kita coba eksekusi task yang ada di gulpfile.js
Nah, sampai disini pengaturan projek gulp sudah selesai, selanjutnya kita akan mencoba membuat struktur folder. Tapi jika sobat masih penasaran kenapa gulp harus diinstall 2 kali (global dan lokal), yuk kita lihat jawabanya:
- Dependensi atau module npm setiap projek berbeda-beda.
- Gulp global dapat diakses dari setiap folder, sedangkan gulp lokal tidak
- Gulp lokal digunakan untuk mengeksekusi task dalam gulpfile.js yang masih dalam satu folder.
Struktur Folder
Nah, Hal yang pertama kita lakukan adalah membuat struktur folder dalam manage projek gulp, terlihat seperti gambar berikut :
Terlihat ada 2 folder utama yaitu app dan build. Folder build adalah optimasi dari folder app yang siap untuk di deploy atau publish. Sedangkan folder app digunakan pada saat proses development atau melakukan perubahan-perubahan dalam projek.
Selanjutnya: Langkah Mudah Membuat Task dengan Gulp