Beranda » Coding » Panduan untuk Menggunakan SublimeLinter untuk Pengembang

    Panduan untuk Menggunakan SublimeLinter untuk Pengembang

    Linter adalah alat yang sangat diperlukan dalam pengembangan web modern. Ini membantu kita untuk tetap terhubung dengan kesalahan dan menegakkan praktik terbaik saat menulis kode. Jika Anda menggunakan SublimeText, saya sangat menyarankan untuk menginstal SublimeLinters. Selama bertahun-tahun, SublimeLinters telah menjadi perangkat perkakas listrik di SublimeText dan membawa paket-paket resmi yang terhubung ke berbagai bahasa pemrograman..

    Dalam tutorial ini, kita akan melihat cara menginstal dan mengatur SublimeLinter. Mari kita mulai saja.

    Mulai

    Cara termudah untuk menginstal SublimeLinter 4 adalah melalui Kontrol Paket SublimeText. Sejak di SublimeLinter 3, setiap linter harus dipasang secara terpisah. Ini memungkinkan SublimeLinter untuk berjalan lebih efisien dengan hanya menjalankan linter yang telah kami instal.

    Karena saya sering menggunakan HTML, CSS, JS, dan PHP di proyek-proyek saya, saya ingin menginstal linter untuk bahasa-bahasa ini. Dalam Kontrol Paket, Saya menginstal SublimeLinter bersama-sama dengan plugin berikut:

    • SublimeLinter-html-rapi
    • SublimeLinter-stylelint
    • SublimeLinter-eslint
    • SublimeLinter-php

    Kemudian, agar plugin tersebut berfungsi, kita juga perlu menginstal linter untuk bahasa, yaitu HTML Tidy, CSSLint, JSHint, dan PHP CLI.

    Bagi Anda yang menggunakan OSX, Tidy dan PHP sudah diinstal sebelumnya dalam sistem. Untuk memverifikasi, jalankan dua perintah berikut secara berurutan.

     rapi --version php --version 

    Perintah-perintah ini akan menunjukkan kepada Anda versi Tidy dan PHP yang Anda miliki. Anda dapat melanjutkan menggunakannya dalam Teks Sublime.

    Jika Anda menggunakan Windows atau Linux, atau tidak menginstalnya, Anda dapat mengikuti instruksi di bawah ini.

    Menginstal HTML Tidy

    Untuk menginstal HTML Tidy:

    • Di OSX, jalankan perintah ini di Terminal buatan instal homebrew / dupes / rapi
    • Di Linux, gunakan perintah ini sudo apt-get install rapi.
    • Di Windows, Anda dapat mengambil penginstal EXE dari TidyBatchFiles.

    Menginstal PHP CLI

    • Pengguna OSX dapat menginstal PHP dengan sistem curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5 perintah. Ini akan menginstal PHP 5.5, yang merupakan versi terbaru, pada saat penulisan.
    • Linux pengguna dapat mengikuti tutorial komprehensif ini dari DigitalOcean.
    • Untuk pengguna Windows, Anda dapat mengunduh penginstal di sini.

    Menginstal Styleint

    Selanjutnya, kita akan menginstal linter CSS yang disebut Stylelint yang akan memungkinkan kita untuk memeriksa dan menegakkan praktik terbaik dalam file CSS kita. Instruksi berikut dapat diikuti di ketiga platform: OSX, Windows, dan Linux. Saya kira Anda sudah menginstal Node.js dengan NPM.

    Untuk menginstal Stylelint, jalankan:

     npm instal -g stylelint 

    Perhatikan bahwa Anda juga perlu menambahkan file konfigurasi Stylelint ke direktori proyek Anda, dan instal juga konfigurasi standar seperti stylelint-config-standard. Setelah ini dikonfigurasi, Anda harus menemukan kesalahan yang disorot seperti di bawah ini.

    Menginstal ESLint

    Kami juga akan menginstal ESLint, linter modern dan sangat dapat dikonfigurasi untuk JavaScript. Ini akan membantu kami untuk menegakkan praktik terbaik serta menangkap potensi kesalahan saat menulis JavaScript. Menginstal ESLint juga membutuhkan Node.js dengan NPM.

    Untuk menginstalnya, jalankan.

     npm instal -g eslint 

    Demikian pula, Anda perlu menambahkan konfigurasi ESLint ke proyek Anda, atau menggunakan konfigurasi yang telah ditentukan seperti eslint-config-recommended.

    Kita semua siap. Kita bisa mulai linting HTML, CSS, JS, dan PHP di SublimeText menggunakan SublimeLinter 4.

    Fitur Baru di SublimeLinter 4

    SublimeLinter 4 menghadirkan beberapa fitur baru, dan yang mudah terlihat adalah panel yang menampilkan semua kesalahan dari file yang dibuka. Jika Anda berada di Mac, tekan Command + Ctrl + A. Di Windows dan Linux, Anda dapat menekan Ctrl + K, Ctrl + A.

    Tombol pintas akan menampilkan daftar kesalahan, seperti yang ditunjukkan pada tangkapan layar berikut.

    Menggunakan ↑ dan ↓ untuk menavigasi daftar, dan halaman akan menggulir ke baris yang tepat di mana kesalahan terjadi.

    Visual yang lebih baik

    Kita sekarang dapat mengarahkan kursor ke atas di editor atau hanya baris di mana kesalahan terjadi untuk melihat pesan kesalahan. Ini tidak mungkin di versi sebelumnya.

    Sangat bisa dikonfigurasi

    SublimeLinter 4 sekarang lebih dapat dikonfigurasi daripada sebelumnya. Sebagai contoh, sekarang kita dapat mengubahsuaikan “gaya” untuk setiap konfigurasi linter. Ini memungkinkan kita untuk mengatur ikon, warna, mode serat, path, dan variabel lingkungan untuk setiap linter secara terpisah.

    Referensi Lebih Lanjut

    Saya harap pengantar singkat ini dapat membantu bangun dan berjalan dengan SublimeLinter. Anda juga dapat merujuk ke referensi jika Anda ingin lebih banyak barang canggih.

    • Dokumen Resmi SublimeLinter
    • Serat dalam perangkat lunak dan pemrograman - WikiPedia
    • Repositori SublimeLinter