TIL: How to configure SublimeText for prettier code

This week I added a Python linter and an automatic editor configurator (configurer?) to SublimeText and I'm a lot happier.

Step 1: Install Package Control

You will need to install Package Control. The instructions in that link are very clear.

Once Package Control is installed, you can get to it by typing cmd + shift + P when in SublimeText.

packagecontrol.png

Step 2: Add a linter

A linter is a tool that checks for small mistakes in your code. Flake8, a Python linter, checks for PEP 8 violations (like trailing whitespace), unused imports, syntax errors, and other helpful stuff. (You might find Eldarion's post about clean code helpful.)

Follow the steps in Three steps to lint Python 3.6 in Sublime Text to get started. The linked post will walk you through the following:

  • Installing Flake8 (pip install flake8)

  • Installing the SublimeLinter plugin (more detailed instructions in the docs)

  • Installing the SublimeLinter-flake8 plugin

  • Configuring the linter

Once you have done that, open a Python file and make a mistake on purpose. Save the file, and you will see your linter yell at you helpfully.

linter_example.png

You can customize the ways your linter alerts you to code violations. See the docs if you would prefer your linter to be a little less obnoxious than mine is.

Step 3: Install EditorConfig

My Python sin is that I'm overly attached to whitespace at the end of lines. I blame the English degrees. It's ingrained in me to type the spacebar at the end of anything I do, and it's a habit that's so hard to break.

Within a few days of installing a linter plugin for SublimeText, I was getting pretty sick of the linter pointing out my love of trailing whitespace and I joked about it to my colleague Jeff. That's when he told me about EditorConfig. You install the EditorConfig plugin for SublimeText, create an .editorconfig file, and your editor will automatically correct certain kinds of errors for you.

  1. In SublimeText, use Package Control to search for "Install" and select "Package Control: Install Package."

  2. In the next modal that opens, search for "EditorConfig." Click on it.

  3. Nothing will happen, but EditorConfig is now installed.

  4. At the top level of a project, create a file called .editorconfig.

  5. Tell the file what you want your editor to do. There are a ton of properties you can set. Here's the DjangoCon 2017 .editorconfig for reference:

# http://editorconfig.org
root = true

[*]
indent_style = space // Converts tabs to spaces
indent_size = 4 // 4 spaces per tab 
end_of_line = lf // Helps keep Windows, Mac, Linux on the same page since they handle end of line differently
charset = utf-8
trim_trailing_whitespace = true // Auto-trims trailing whitespace
insert_final_newline = true // Auto-adds a blank newline to the end of a file

[*.scss]
indent_size = 2 // More common to see 2 spaces in SCSS, HTML, and JS 

[*.html]
indent_size = 2

[*.js]
indent_size = 2

As soon as you save that file, test it out. Add a whole bunch of trailing whitespace to a line of code, save the file, and watch your whitespace disappear without your linter ever knowing it was there.

Final notes

There are other linters out there. My colleagues mentioned Anaconda (turns SublimeText into a Python IDE and comes with linting), SublimeLinter without Flake8, and PyLinter. I'm not overly attached to the one I'm using because it's about a week old for me. Feel free to experiment.

Huge thanks to Jeff Triplett for proofreading this post, introducing me to these tools, and making my day job a little easier.