Cara Menambahkan Linter dan Formatter di Vim

Cara Menambahkan Linter dan Formatter di Vim#

Halo, para penggemar Vim! Kalian pasti udah ngerasain betapa kerennya Vim sebagai text editor, kan? Tapi, pernah nggak sih kalian kepikiran buat nambahin linter dan formatter biar coding kalian makin rapi dan bebas dari error? Nah, di artikel ini, gue bakal ngebahas gimana caranya nambahin linter dan formatter di Vim. Yuk, simak!

Apa Itu Linter dan Formatter?#

Sebelum kita mulai, gue mau jelasin dulu nih apa itu linter dan formatter.

• Linter: Alat yang ngecek kode kalian buat nyari kesalahan sintaksis, potensi bug, atau gaya penulisan yang nggak sesuai dengan standar. Contoh linter populer adalah ESLint buat JavaScript, Pylint buat Python, dan RuboCop buat Ruby.

• Formatter: Alat yang otomatis ngeformat kode kalian biar sesuai dengan standar gaya penulisan. Contoh formatter populer adalah Prettier buat JavaScript, Black buat Python, dan gofmt buat Go.

Langkah 1: Install Plugin Manager#

Pertama-tama, kita butuh plugin manager buat Vim. Salah satu yang paling populer adalah vim-plug. Buat install vim-plug, kalian bisa ikutin langkah-langkah di bawah ini:

1. Buka terminal kalian.
2. Jalankan perintah berikut buat download vim-plug:
   code

   content_copy

   curl -fLo ~/.vim/autoload/plug.vim --create-dirs \
       https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim

Langkah 2: Install Linter dan Formatter#

Setelah vim-plug terinstall, kita bisa mulai nambahin linter dan formatter. Kita bakal pake plugin ALE (Asynchronous Lint Engine) buat linter dan formatter.

1. Buka file konfigurasi Vim kalian (~/.vimrc).
2. Tambahkan konfigurasi berikut buat nambahin ALE:
   code

   content_copy

   call plug#begin('~/.vim/plugged')
   Plug 'dense-analysis/ale'
   call plug#end()

3. Simpan file dan buka Vim.
4. Di dalam Vim, jalankan perintah :PlugInstall buat install ALE.

Langkah 3: Konfigurasi ALE#

Setelah ALE terinstall, kita bisa konfigurasi ALE buat ngecek dan ngeformat kode kita. Tambahkan konfigurasi berikut di ~/.vimrc:

let g:ale_linters = {
\   'javascript': ['eslint'],
\   'python': ['pylint'],
\   'ruby': ['rubocop'],
\}

let g:ale_fixers = {
\   'javascript': ['prettier'],
\   'python': ['black'],
\   'ruby': ['rubocop'],
\}

let g:ale_fix_on_save = 1

Penjelasan konfigurasi di atas:

• g:ale_linters: Mendefinisikan linter yang bakal dipake buat tiap bahasa pemrograman.
• g:ale_fixers: Mendefinisikan formatter yang bakal dipake buat tiap bahasa pemrograman.
• g:ale_fix_on_save: Ngeaktifin fitur buat ngeformat kode otomatis pas kalian nyimpen file.

Langkah 4: Install Linter dan Formatter Eksternal#

ALE cuma sebagai interface buat linter dan formatter. Jadi, kalian perlu install linter dan formatter eksternal di sistem kalian. Contoh, buat JavaScript:

1. Install Node.js dan npm.
2. Install ESLint dan Prettier:
   code

   content_copy

   npm install -g eslint prettier

Buat Python:

1. Install Python dan pip.
2. Install Pylint dan Black:
   code

   content_copy

   pip install pylint black

Buat Ruby:

1. Install Ruby dan gem.
2. Install RuboCop:
   code

   content_copy

   gem install rubocop

Langkah 5: Coba Linter dan Formatter#

Sekarang, coba buka file kode kalian di Vim. ALE bakal otomatis ngecek kode kalian dan nampilin error atau warning di sidebar. Pas kalian nyimpen file, ALE bakal otomatis ngeformat kode kalian pake formatter yang udah kalian tentuin.

Tips Tambahan#

• Kalian bisa ngecek daftar linter dan formatter yang didukung ALE di dokumentasi resminya.
• Kalian juga bisa nambahin konfigurasi khusus buat linter atau formatter tertentu di ~/.vimrc. Contoh, buat ngeset opsi ESLint:
  code

  content_copy

  let g:ale_javascript_eslint_options = '--config /path/to/your/eslintrc'

Nah, gimana? Gampang banget kan nambahin linter dan formatter di Vim? Dengan ALE, kalian bisa ngejamin kode kalian rapi dan bebas dari error. Selamat mencoba!