> ## Content Index
> Fetch the complete content index at: https://debug.my.id/llms.txt
> Use this file to discover other available public pages before exploring further.

# Cara mudah menginstall Linter di Sublime Text
- URL: https://debug.my.id/mudah-menginstall-linter-di-sublimetext/
- Published: 2016-01-20T07:49:00.000Z
- Updated: 2025-06-28T13:22:57.000Z
- Description: Panduan singkat untuk mengenal apa itu Linter dan bagaimana cara menginstallnya di Sublime Text
- Author: Tukang Debug
- Tags: Aplikasi, Tip/trik

## #Apakah Linter itu ?

**Linter** secara singkat adalah sebuah tool/aplikasi yang melakukan pengecekan terhadap kode program, baik error maupun warning atau lain lainnya.

Secara default, jika anda melakukan coding script misalkan Javascript dengan menggunakan SublimeText, maka anda tidak akan mendapatkan informasi apa-apa selama melakukan *coding*. Anda baru akan mengetahui jika terdapat error setelah anda mencobanya langsung di browser.

Jika project Javascript yang anda kerjakan tergolong kecil, maka hal ini mungkin tidak terlalu bermasalah. Akan tetapi bayangkan jika hal ini terjadi terus adan project anda bertambah besar. Rasanya hal ini terlalu banyak menghabiskan waktu, tenaga dan pikiran. Nah, alangkah enaknya jika error dan lain-lain tersebut ditampilkan langsung pada waktu kita coding.

Beruntung, tersedia banyak plugin *linter* di SublimeText Nah. Salah satu plugin *linter* yang sangat populer di SublimeText adalah [SublimeLinter](https://packagecontrol.io/packages/SublimeLinter?ref=debug.my.id). Berikut ini adalah cara untuk meng-install SublimeLinter beserta plugin tambahan lainnya.

## #Menginstall SublimeLinter

Caranya sangat mudah. Pertama, pastikan anda sudah menginstall plugin Package Control di SublimeText. Jika belum, silakan anda membaca artikel : [Cara mudah menginstall Package Control di Sublime text](https://debug.my.id/cara-menginstall-package-control-sublime-text/) ini.

Buka **Package Control** dengan tombol **Ctrl Shift p** kemudian ketikkan **Package Control** , atau via menu **Preferences > Package Control**. Kemudian pilih **Install Package**. Package Control kemudian akan melakukan sejenis query ke repositories. Jadi, tunggu saja selama beberapa saat.

![Cara mudah menginstall Linter di Sublime Text](https://debug.my.id/content/images/2025/06/image-37.png)

Maka akan muncul daftar plugin-plugin yang dapat di-install. Tulis **SublimeLinter**, maka akan muncul plugin-plugin yang memiliki nama SublimeLinter. Pilih plugin seperti terlihat pada gambar di bawah. Kemudian tekan tombol **enter** untuk menginstall package tersebut. Tunggu selama beberapa saat.

![Cara mudah menginstall Linter di Sublime Text](https://debug.my.id/content/images/2025/06/image-38.png)

Sampai di sini maka SublimeLinter sudah terinstall dengan baik. Akan tetapi ini masih setengah jalan. SublimeLinter ini hanyalah sebagai plugin utama atau framework untuk *linter* spesifik lainnya. Selanjutnya, anda harus menginstall **linter-linter khusus** yang sesuai dengan jenis file anda.

## #Linter untuk JavaScript

Ada banyak Javascript *linter* yang tersedia, salah satunya adalah [SublimeLinter-jshint](https://packagecontrol.io/packages/SublimeLinter-jshint?ref=debug.my.id). Berikut ini adalah cara menginstall **SublimeLinter-jshint**.

Pastikan komputer anda sudah terinstall **Node.js** dan **npm**.  
Jika belum, silahkan anda membaca artikel tentang [Apa dan bagaimana cara menginstall Node.js dan npm](https://debug.my.id/apakah-nodejs-dan-cara-install-di-windows-linux-mac/).

Install ***jshint*** dengan cara menuliskan dan menjalankan perintah ini di terminal/cmd.

```bash
npm install -g jshint
```

Jika anda menggunakan Linux, mungkin anda memerlukan akses admin dengan **sudo**

```bash
sudo npm install -g jshint
```

Hal ini dikarenakan parameter **\-g** yang artinya module/aplikasi **jshint** tersebut akan terinstall di **global**.

Install **SublimeLinter-jshint** dengan menggunakan **Package Control**. Silahkan anda cari package yang bernama **SublimeLinter-jshint**, kemudian install.

[](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW4pNSt5ICkzbcqvROExEe6QiiTH0KST0O%5F-2bfOp1GCA9ZK6eWq6psjw9PpVh6W87ZQ0CON5xSCIaBGwCUbW66yk6SsJBh6uc9b3JrO7x6JzbuqkkJhT9kBH3IklREARWKd%5FzP%5Fqqa5g/s1600/Selection%5F003.jpg?ref=debug.my.id)

![Cara mudah menginstall Linter di Sublime Text](https://debug.my.id/content/images/2025/06/image-39.png)

Jika semuanya berjalan lancar, maka Javascript Linter sudah siap untuk digunakan.

Buka file Javascript anda, maka *linter* akan berlangsung secara otomatis yang akan memunculkan status warna.Merah jika terjadi error. Kuning jika terdapat peringatan/warning

![Cara mudah menginstall Linter di Sublime Text](https://debug.my.id/content/images/2025/06/image-40.png)

## #Linter untuk CSS

Mirip dengan JavascriptLinter sebelumya, salah satu plugin CSS Linter yang tersedia adalah [**SublimeLinter-csslint**](https://packagecontrol.io/packages/SublimeLinter-csslint?ref=debug.my.id). Plugin ini bergantung pada aplikasi **csslint** yang dapat diinstall dengan Node.js.

Oleh karena itu, pertama-tama silahkan install **csslint** dengan menggunakan **npm**. 

```bash
npm install -g csslint
```

Sama dengan sebelumnya, tambahkan **sudo** jika perlu.

![](https://debug.my.id/content/images/2025/06/image-41.png)

Buka file css yang anda inginkan, maka **csslint** akan melakukan *linter* secara otomatis.

![](https://debug.my.id/content/images/2025/06/image-42.png)

## #Linter untuk HTML

Salah satu HTML linter yang tersedia adalah **Sublime​Linter-html-tidy** ([https://packagecontrol.io/packages/SublimeLinter-html-tidy](https://packagecontrol.io/packages/SublimeLinter-html-tidy?ref=debug.my.id)). Sesuai dengan namanya, linter ini menggunakan/bergantung aplikasi **tidy**.

Aplikasi tidy ini sudah tersedia untuk Linux, Mac dan Windows.

**Mac OS X**  
Biasanya **tidy** sudah terinstall, jadi tidak perlu dilakukan apapun.

**Linux**  
Tidy sudah tersedia dihampir semua distro, sehingga cara paling mudah untuk menginstall **tidy** adalah dengan menggunakan **package manager**. Misalkan di **Debian** dan turunannya (**Ubuntu**) dengan menggunakan **apt**.

```bash
sudo apt-get install tidy
```

**Windows**  
Download file setup/binary **tiny** di : https://www.paehl.com/open\_source/?HTML\_Tidy\_for\_Windows kemudian install sampai selesai.

### Install plugin Sublime**​Linter-html-tidy**

Silakan install plugin SublimeLinter-html-tidy dari Package Control.

![](https://debug.my.id/content/images/2025/06/image-43.png)

Buka file HTML untuk melihat hasilnya.

![](https://debug.my.id/content/images/2025/06/image-44.png)

## Linter untuk PHP

Salah satu plguin php linter yang tersedia dan sangat mudah untuk diinstall adalah [Sublime​Linter-php](https://packagecontrol.io/packages/SublimeLinter-php?ref=debug.my.id)

Pastikan anda sudah menginstall **php**. Dalam kondisi normal, **php** sudah akan terdeteksi dalam **PATH**, sehingga dapat langsung dipanggil dari terminal/cmd. Untuk mengecek apakah **php** sudah terinstall dengan benar, silahkan jalankan perintah ini :

```bash
php --version
```

Jika anda mendapatkan hasil seperti di bawah ini, maka artinya php sudah siap untuk digunakan.

![](https://debug.my.id/content/images/2025/06/image-45.png)

Install plugin **Sublime​Linter-php** dengan menggunakan **Package control**.

![](https://debug.my.id/content/images/2025/06/image-46.png)

Buka file php untuk melihat hasil linter php ini.

![](https://debug.my.id/content/images/2025/06/image-47.png)

## Kesimpulan

**Linter** jelas sangat berguna dan membantu dalam menambah kecepatan dan mengurangi kesalahan selama coding. Selain plugin-plugin linter di atas, tentu masih banyak linter-linter lain untuk bahasa-bahasa yang lain pula, misalkan **python**, **java**, **ruby** dan lain-lain.

Sekian tip/trik kali ini, semoga yang sedikit ini bermanfaat.

[](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBqnBqYzwGxPgBzUi-2nZtlxVi-Aa8J2pKdIfhLMe45qnu5TBvnlf5aUlXcZf28kqzdaTCRNnOFJjAGLrf%5F6dhEsh9OPK9XdfO5hjIiwAbBbDFuO8EgDRy54KEzWP4Y-zFT%5FIQILpxKDA/s1600/Selection%5F013.jpg?ref=debug.my.id)

[](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8fVONtiS%5Fo-F8ltn64nlfWdD0pKTNGPrrYEQaCjdxN7RjdwxK%5FOZxkGeu%5FxAZaHjVKuxCw6Mbf7QElai9LzIblkUpXrxr4A4bGJKM6ASmlKZUC-pehdXE6jL8sqaCyk7bAAZeuS2kQhI/s1600/Selection%5F010.jpg?ref=debug.my.id)