Migrasi ke Biome
Menuliskan sedikit tentang proses migrasi dari ESLint & Prettier ke Biome.
Kita pasti sudah sering mendengar / menggunakan ESLint sebagai linter dan Prettier sebagai formatter dalam sebuah project JavaScript. Seiring berjalannya waktu pasti ada library baru terutama dalam ekosistem JavaScript, salah satunya adalah Biome sebagai tool yang menggabungkan formatter dan linter.
Apa itu Biome?
Biome adalah suatu library untuk menerapkan linter dan formatter untuk project JavaScript kita. Dulunya library ini bernama rome dan sekarang sudah tidak dimaintain lagi, sehingga dilanjutkan oleh komunitas dan diberi nama Biome. Jika ingin melihat cerita lengkapnya, bisa melalui tautan berikut:
Memulai Migrasi
Untuk proses migrasi dari ESLint dan Prettier sendiri sudah dituliskan pada dokumentasi Biome. Yang terlihat berbeda antara ESLint dan Biome adalah penulisan rule-nya. Jika di ESLint menggunakan kebab-case, di Biome sendiri menggunakan camelCase untuk penulisan rule-nya.
Untuk instalasinya dapat menjalankan perintah:
pnpm add --save-dev --save-exact @biomejs/biome pnpm biome init
Lalu, jalankan perintah untuk memindahkan konfigurasi dari ESLint ke Biome:
pnpm biome migrate eslint --write
Dan perintah untuk memindahkan konfigurasi Prettier:
pnpm biome migrate prettier --write
Pada kasus saya, ada penggunaan plugin Prettier untuk Tailwind. Di Biome sendiri sudah membuatkan rule sendiri untuk menerapkan sorted class untuk utility framework seperti Tailwind:
Akhirnya, kita bisa menghapus ESLint dan Prettier serta config / plugin tambahannya jika ada:
pnpm remove eslint prettier eslint-config-next prettier-plugin-tailwindcss
Kita juga bisa menambahkan script baru pada file package.json untuk menjalankan linter dan formatter dari Biome:
"scripts": { "lint": "biome lint", "lint:write": "biome lint --write", "lint:write:unsafe": "biome lint --write --unsafe", "format": "biome format", "format:write": "biome format --write" },
Kesimpulan
Proses migrasi cukup smooth. Mungkin ada beberapa rules yang masih work in progress seperti useSortedClasses tadi, sehingga ada beberapa algoritma yang belum diadaptasi. Proses pengecekan dari Biome juga cukup cepat, seperti klaim pada website-nya:
Kita juga bisa melihat progress development dari Biome melalui issue berikut:
Jika kalian ingin tahu kode lebih lengkap terkait proses migrasi pada post ini dapat mengunjungi pull request berikut:
Sekian dan terima kasih.