Sudah lama rasannya kami tidak menggunakan angular untuk menyelsaikan project. Terahir versi angular yang kami gunakan adalah versi 4. Tepat pada 1 November kemarin angular telah merisi versi terbarunnya yakni versi 5.
Secara singkat, berikut ini adalah bagian yang dilakukan penyempurnaan baik dari sisi fitur ataupun bug pada angular versi 5 :
- Form
- Animasi
- Router
- ServiceWroker, sangat bermanfaat bagi anda yang sedang mengembangkan PWA(Progressive web apps).
- PlatformServer, kemampuan SSR(Server side rendering) semakin bagus.
Sebenarnya tidak ada cara khusus untuk melakukan update atau upgrade angular ke versi 5 ataupun versi tertentu. Cara ini dapat kita gunakan untuk mengupdate ke angular versi berapapun selama tidak ada perubahan major yang mengharuskan perubahan mengenai mekanisme update angular.
Cara update angular dan angular cli ke versi 5
Pertama pastikan bahwa anda telah memiliki angular cli yang terinstall di local machine anda. Jika belum punya maka anda tidak akan bisa melakukan update angular hhe. Untuk mengecek apakah angualr telah terinstall di local machine anda adalah dengan menggunakan perintah berikut ini
ng --version
jalankan perintah diatas pada terminal / commandline/ powershell (tergantung dari sistem operasi yang anda gunakan. Perintah diatas akan mengeluarkan informasi mengenai versi angular yang telah terinstall dilocalmachine anda.
Jika angular belum terinstall akan keluar warning berupa
~bash: ng: command not found
ini adalah versi angular yang saat ini sedang terinstall di local machine kami.
sekarang kita sedang menggunakan angular cli versi 1.2.7. Selanjutnya adalah dimana kita dapat mengetahui versi angular yang sedang digunakan ? versi angular tersebut terletak di package.json. Buka folder project angular anda yang dibuat dengan versi angular cli tersebut. Jika tidak ingat cukup buat project baru
ng new project
setelah anda berada didalam folder project angular tersebut cari file bernama package.json dan bukalah dengan menggunakan terminal ataupun texteditor. Kami lebih suka dengan menggunakan terminal karena membutuhkan effort yang lebih kecil, cukup ketikan perintah berikut ini
nano package.json
maka pada terminal akan muncul isi dari file package.json tersebut
lalu lihat pada line @angular/core. Disini kita tahu bahwa versi angular yang kita gunakan adalah versi 4. Oke setelah kita mengetahui :
- Versi angular CLI
- Versi angular
Maka kita siap untuk melakukan update angular secara global maupun secara project. Pertanyaan selanjutnya adalah mana yang butuh untuk diupdate angular cli/angular secara global ataukah angular cli/angular yang berada dilocal project?
Update secara global
1. uninstall secara global angular-cli anda dengan menggunakan perintah berikut ini
npm uninstall -g @angular/cli
perintah diatas akan melakukan install @angular-cli secara global. ini artinnya anda tidak akan bisa menggunakan perintah ng di direktori manapun.
Anda membutuhkan root permission untuk menggunakan parameter -g. Pastikan menuliskan sudo jika anda belum memiliki hak akses root. Jika pada windows pastikan menggunakan power shell
2. Hapus cache NPM
cache memang sangat berguna untuk kebutuhan performa namun npm cache dapat membuat proses installasi package baru menjadi bermasalah. Oleh karena itu kita membutuhkan membersihkan cache npm dengan perintah berikut ini
npm cache clean
perintah diatas tidak membutuhkan permission super user atau root.
3. Install angular cli kembali secara global
Dengan melakukan install kembali angular cli maka secara otomatis versi angular cli ataupun angular yang akan digunakan diproject selanjutnya akan mengacu pada versi terahir atau latest. Sebelum menjalankan perintah install angular-cli jangan lupa melakukan cache clean pada langkah kedua untuk memastikan update/upgrade angular berhasil dengan baik.
npm install -g @angular/cli@latest
Jangan lupa perintah -g pada npm harus menggunakan root privilages. Gunakan sudo atau powershell pada windows.
DONE!
Kita telah berhasil melakukan update angular cli dan angular secara global. Versi terahir angular akan digunakan pada project baru. lalu bagaimana jika kita ingin melakukan update pada local package ?
Update pada local package.
Terdapat tiga langkah yakni
1. Hapus folder node_modules & dist
langkah ini diperuntukan agar kita dapat melakukan upgrade seluruh package yang ada sesuai dengan depdencynya. Perintah yang digunakan adalah sebagai berikut ini
rm -rf node_modules dist
dist perlu dihapus karena menyimpan hasil build dari project angular yang kita miliki. hal ini penting untuk menghindari conflict.
2. Install angular
jalankan perintah berikut untuk install angular pada local package
npm install --save-dev @angular/cli@latest
namun ini bukan berarti angular/angular cli telah terinstall dengan versi paling ahir (latest). Kita harus melakukan install dengan menggunakan perintah
npm install.
3. DONE.
cek versi angular cli anda secara global dengan menggunakan perintah
ng --version
atau
ng -v
keduannya sama. Maka pada local machine kami menghasilkan detail sebagai berikut ini
untuk mengetahui versi angular cukup buat project dan buka package.json ataupun juga dapat menggunakan perintah yang sama (ng -v atau ng –version).
kita dapat lihat versi angular core saat ini adalah 5.0.0 Sehingga kita telah berhasil melakukan upgrade atau update angular ke versi 5.
Terimakasih
Semoga bermanfaat untuk kita semua.