Beranda » Coding » Linting JavaScript dengan JSHint

    Linting JavaScript dengan JSHint

    Linting dalam pemrograman komputer adalah proses menganalisis kode statis untuk menemukan masalah seperti sintaks yang salah, dan penggunaan kode yang rapuh. Alat yang digunakan untuk linting dikenal sebagai a serat atau linter. Salah satu linter yang tersedia untuk JavaScript hari ini adalah JSHint.

    JSHint tersedia untuk berbagai platform. Alat web online yang sebagian besar dari kita kenal adalah di jshint.com. Ada juga alat baris perintah melalui Node.js, Sebuah API JavaScript, beberapa editor teks, dan plugin IDE untuk JSHint. Anda dapat melihat daftar lengkap alat JSHint yang tersedia untuk lingkungan yang berbeda di halaman unduh dan instal situs web JSHint.

    Menurut situs webnya, dua cara paling umum alat JSHint digunakan adalah sebagai alat baris perintah dan API. Mari kita lihat bagaimana Anda dapat mengunduh menggunakan keduanya, bersama dengan pilihan lain yang disediakan alat.

    Melalui Alat Baris Perintah

    (1) Jika Anda belum menginstal Node.js di komputer Anda, maka Anda harus membuka situs webnya dan mengunduh dan menginstalnya terlebih dahulu. Untuk memeriksa apakah Node.js berhasil diinstal, Anda dapat menjalankan perintah npm -versi di antarmuka baris perintah (CLI) dan itu akan menunjukkan kepada Anda versi Node.js di komputer Anda (atau Anda bisa menjalankan perintah npm dan lihat apa yang terjadi).

    (2) Untuk menginstal alat JSHint, jalankan perintah npm instal jshint di CLI. Jika Anda ingin memeriksa apakah JSHint telah berhasil diinstal, jalankan perintah jshint -versi untuk melihat versinya. Setelah langkah ini selesai, instalasi selesai.

    (3) Untuk menjalankan alat, buka direktori di CLI tempat file JavaScript Anda (katakanlah test.js) adalah dan jalankan perintah jshint test.js. Hasil analisis alat pada kode JavaScript Anda akan muncul (seperti ini):

    Melalui API JavaScript

    (1) Unduh file terkompresi dari tautan GitHub ini, dan unzip. Dalam dist folder Anda akan menemukan jshint File JS (pustaka API).

    (2) Untuk menggunakan API, tambahkan jshint File JS ke proyek Anda dan tautkan ke halaman Anda. API dapat diakses dalam kode JavaScript menggunakan fungsi / objek yang disebut JSHINT. Di bawah ini adalah contoh kode HTML di mana JavaScript API JSHint digunakan untuk menganalisis kode JavaScript yang ada di sumber susun dan tampilkan hasil analisis pada halaman.

         Dokumen       

    (3) Kami melewati sumber array yang berisi kode sumber JavaScript untuk dianalisis dan pilihan objek yang berisi opsi linting (kita akan masuk ke pilihan singkat) sebagai parameter ke JSHINT fungsi. Hasil analisis (objek JSON) diambil dari JSHINTProperti fungsi dipanggil data.

    (4) JSON.stringify digunakan hanya untuk tampilan di sini, untuk menampilkan hasil yang dikembalikan dari data berfungsi dalam format string pada halaman. Itu yg diperindahkan String JSON terlihat seperti ini. Bagian yang disorot adalah kesalahan yang ditemukan oleh JSHint yang diucapkan dalam kalimat sederhana.

    Opsi Linting

    Opsi linting, mari kita konfigurasikan proses linting. Kita dapat menentukan jenis kesalahan atau pengurangan mana yang perlu disisir dan mana yang tidak. Dalam contoh sebelumnya dua opsi linting digunakan yaitu undef dan tidak digunakan.

    undef opsi menandai variabel yang tidak dideklarasikan, dan tidak digunakan akan menandai variabel yang dideklarasikan tetapi tidak pernah digunakan. Seperti ini, ada banyak lagi opsi yang dapat Anda lihat daftar di halaman ini, jika Anda ingin mencari opsi, ada bilah pencarian yang disediakan di sudut kanan atas.

    Jika Anda menggunakan alat CLI melalui Node.js, Anda dapat menulis opsi linting di dalam a package.json file di bawah properti jshintConfig di direktori yang sama. Anda juga dapat menambahkan opsi sebagai arahan dalam kode JavaScript.

     // - test.js - / * jshint undef: true, unused: true * / foo (); a = 7;

    Ada lebih banyak cara untuk mengonfigurasi opsi linting di proyek Anda berdasarkan alat yang Anda gunakan. Lihat berbagai cara untuk konfigurasi sini.