Guide: SublimeLinter for Developers: Quick Guide and Tips
Linter is an indispensable tool in modern web development. It helps us avoid mistakes and enforce best practices in code writing. If you are using SublimeText I highly recommend installing SublimeLinters. Over the years, SublimeLinters has developed into a powerful tool suite in SublimeText and has released official packages that connect to linters of various programming languages. In this tutorial, we will see how to install and configure SublimeLinter. Let’s just get started.
To start
The easiest way to install SublimeLinter 4 is through the SublimeText Package Control. Since in SublimeLinter 3each linter must be installed separately. This allows SublimeLinter to work more efficiently using only the linters we have installed. Since I mostly use HTML, CSS, JS and PHP in my projects, I would like to install linters for these languages. In the Package control, I install SublimeLinter along with the following plugins:
SublimeLinter-html-neat SublimeLinter style ribbon SublimeLinter-eslint SublimeLinter-php
For those plugins to work, we then also need to install the linter for the languages, namely HTML Tidy, CSSLint, JSHint and PHP CLI. For those of you using OSX, Tidy and PHP are preinstalled in the system. Run the following two commands in sequence to verify this. neat –versionphp –version These commands will show you the Tidy and PHP version you have. You can start using them in Sublime Text. If you are using Windows or Linux, or have not installed them, you can follow the instructions below.
Install HTML Tidy
Install HTML Tidy:
In OSX, run this command in Terminal brew install homebrew / dupes / tidy In Linux, use this command sudo apt-get install tidy. In Windows, you can download the EXE installer from TidyBatchFiles.
Install PHP CLI
OSX users can install PHP in the system with curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5 command. This will install PHP 5.5, which is the latest version, at the time of this writing. Linux users can follow this extensively tutorial from DigitalOcean. For Windows users, you can download the installer here.
Install Styleint
Next, we will install the CSS linter called Stylelint that will allow us to check and enforce best practices in our CSS files. The following instruction can be followed in all three platforms: OSX, Windows and Linux. I assume you have already installed Node.js with the NPM. To install Stylelint, run: npm install -g stylelint Note that you will also need to add a Stylelint configuration file to your project directory, as well as install a predefined configuration such as stylelint-config-standard. Once configured, the errors should be highlighted as below.
Install ESLint
We are also going to install ESLint, a modern and highly configurable JavaScript linter. This will help us enforce best practices and spot potential errors when writing JavaScript. Installing ESLint also requires Node.js with the NPM. To install it, run. npm install -g eslint Likewise, you should add the ESLint configuration to your project or use the predefined configuration such as eslint-config-recommended. We are all ready. We can start rummaging HTML, CSS, JS and PHP in SublimeText with SublimeLinter 4.
New Features in SublimeLinter 4
SublimeLinter 4 brings several new ones features, and one that stands out easily is the panel that displays all the errors of the open files. If you’re on a Mac, press Command + Ctrl + A. In Windows and Linux, you can press Ctrl + K, Ctrl + A. The keyboard shortcut shows a list of errors, as shown in the following screenshot.
Use the ↑ and ↓ to navigate through the list and the page will scroll to the exact line where the error occurred. Better visual We can now hover the mouse pointer over the gutter in the editor or just the line where the error is occurring to see the error message. This was not possible in the previous version.
Very configurable
SublimeLinter 4 is now more configurable than ever before. For example, we can now adapt custom “styles” to fit any ribbon configuration. This allows us to individually set icons, color, ribbon mode, path and environment variables for each linter.
Further reference
I hope this brief introduction can help up and run with SublimeLinter. You can also refer to the reference if you want more advanced stuff.
SublimeLinter Official Doc Fluff in Software and Programming – WikiPedia SublimeLinter repositories
SublimeLinter for Developers: Quick Guide and Tips: benefits
Faq
Final note
I hope you like the guide SublimeLinter for Developers: Quick Guide and Tips. In case if you have any query regards this article you may ask us. Also, please share your love by sharing this article with your friends. For our visitors: If you have any queries regards the SublimeLinter for Developers: Quick Guide and Tips, then please ask us through the comment section below or directly contact us. Education: This guide or tutorial is just for educational purposes. Misinformation: If you want to correct any misinformation about the guide “SublimeLinter for Developers: Quick Guide and Tips”, then kindly contact us. Want to add an alternate method: If anyone wants to add more methods to the guide SublimeLinter for Developers: Quick Guide and Tips, then kindly contact us. Our Contact: Kindly use our contact page regards any help. You may also use our social and accounts by following us on Whatsapp, Facebook, and Twitter for your questions. We always love to help you. We answer your questions within 24-48 hours (Weekend off). Channel: If you want the latest software updates and discussion about any software in your pocket, then here is our Telegram channel.
