Apa perbedaan antara prettier-eslint, eslint-plugin-prettier dan eslint-config-prettier?

Saya ingin menggunakan Prettier dan ESLint bersama-sama, tetapi saya mengalami beberapa konflik hanya dengan menggunakannya satu demi satu. Saya melihat bahwa ada tiga paket berikut yang tampaknya memungkinkannya digunakan bersama-sama:

• prettier-eslint
• eslint-plugin-prettier
• eslint-config-prettier

Namun, saya tidak yakin mana yang akan digunakan karena semua nama paket ini berisi eslintdan prettier.

Yang mana yang harus saya gunakan?

ESLint mengandung banyak aturan dan mereka yang memformat terkait konflik kekuatan dengan lebih cantik, seperti arrow-parens, space-before-function-paren, dll Oleh karena itu menggunakan mereka bersama-sama akan menyebabkan beberapa masalah. Alat berikut telah dibuat untuk menggunakan ESLint dan Prettier secara bersamaan.

Saya menulis perbandingan dalam format tabel pada intinya, karena Stack Overflow tidak mendukung pemformatan tabel. Lihat jika Anda lebih suka organisasi.

prettier-eslint: Berjalan prettierlalu jalankan eslint --fixpada kode. eslintbiasanya memiliki perbaikan otomatis untuk pemformatan aturan terkait, dan eslint --fixakan dapat memperbaiki pemformatan yang bertentangan yang diperkenalkan oleh Prettier. Anda tidak perlu menjalankan prettierperintah secara terpisah.

eslint-plugin-prettier: Ini adalah plugin ESLint, artinya plugin ini berisi implementasi untuk aturan tambahan yang akan diperiksa ESLint. Plugin ini menggunakan Prettier di bawah tenda dan akan menimbulkan masalah ketika kode Anda berbeda dari keluaran yang diharapkan Prettier. Masalah tersebut dapat diperbaiki secara otomatis melalui --fix. Dengan plugin ini, Anda tidak perlu menjalankan prettierperintah secara terpisah, perintah tersebut dijalankan sebagai bagian dari plugin. Plugin ini tidak mematikan aturan yang terkait dengan pemformatan, dan Anda harus mematikannya jika Anda melihat konflik untuk aturan tersebut baik secara manual atau melalui eslint-config-prettier.

eslint-config-prettier: Ini adalah konfigurasi ESLint, dan berisi konfigurasi untuk aturan (apakah aturan tertentu aktif, nonaktif, atau konfigurasi khusus). Konfigurasi ini memungkinkan Anda menggunakan Prettier dengan konfigurasi ESLint lainnya seperti eslint-config-airbnbdengan menonaktifkan aturan terkait pemformatan yang mungkin bertentangan dengan Prettier. Dengan konfigurasi ini, Anda tidak perlu menggunakan prettier-eslintkarena ESLint tidak akan mengeluh setelah Prettier memformat kode Anda. Namun, Anda perlu menjalankan prettierperintah secara terpisah.

Semoga ini meringkas perbedaannya.

Pembaruan: Ini adalah praktik yang disarankan untuk membiarkan Prettier menangani pemformatan dan ESLint untuk masalah non-pemformatan, prettier-eslinttidak searah dengan praktik itu, karenanya prettier-eslinttidak disarankan lagi. Anda bisa menggunakan eslint-plugin-prettierdan eslint-config-prettierbersama - sama.