A.T.O.M. SHOW HOW TO
A.T.O.M. SHOW INSTALL
A.T.O.M. SHOW FULL

A.T.O.M. SHOW FULL

I encourage you to read full documentation for both stylelint and jshint, as they could be really useful for you. You could use more advanced configuration options for each linters which are out of scope for this article. You could learn more about minimap packages here.

A.T.O.M. SHOW INSTALL

To see errors in a minimap, you should install minimap-linter package. This depends on your main linter settings, but you should see at least on of them. In the examples above you could see that errors are displayed on 4 different places: You could see CSS lint errors by opening and CSS file. You could see errors in different places, depending on your main linter package configuration. To see linter-jshint in action, open any JavaScript file and see if any errors exists.

A.T.O.M. SHOW HOW TO

Here you can see my** linter-stylelint** configuration: How to use it? It is available on Atom package manager and it has only 3 configuration options. Linter-stylelint is an interface for stylelint, CSS linter that helps you enforce consistent conventions and avoid errors in your stylesheets. The most important is to provide of executable jshint node script. Installation could be done via Atom package manager. It is an interface for JSHint, a tool that helps to detect errors and potential problems in your JavaScript code. One of the most popular JavaScript linters for Atom is linter-jshint.

Because I'm a frontend developer, I'll show you how to install linters for CSS and JavaScript. There are many plugins available, full list is available here. You can see full configuration of my linter package here:īasic linter is installed and configured, now we need actual linter plugins for specific programming languages. This settings should turn on linter errors in Atom, so you could fix the problems more easily.

Display Linter Status Info in Status Bar - turn on.Display Linter Info in the Status Bar - turn on.Highlight Error Lines in Gutter - turn on.I encourage you to take your time to understand each one them. After that, open linter package settings. Go ahead and install it from Atom package manager. Not only that, it will force you to write code more carefully. If you forget to put semicolon at the end of a line, linter will immediately show you the error. Let's look at example from previous section. Linter works while you're typing and checks if there are any syntax errors. That's where linter could help you save precious time. Very annoying and time consuming process. Open developer tools, open console tab, inspect errors, go back to Atom, fix the errors, go back to browser again and see if it runs now. When you open the widget in a browser to test it, it's not working. You write a hundreds of lines of code, but in a hurry, you forget to add a couple of semicolons here and there. Imagine yourself working on a new JavaScript widget. Linter is a program which analyses your code during coding process. Lint, linter, linting? What is it and why you should use it? I'll try to show you how Atom linter packages could save you a lot of development time.

A.t.o.m. show