What linter do you use in Atom?

Hey guys,

Just wondering, has anyone got ‘on-the-fly’ linting set up in Atom? I’ve installed a couple of linter plugins, but I can’t seem to specify the rules for the lint plugin to follow.

I see there is a file called .eslintrc.js, but a number of the plugins I have tried don’t like the .js on the end of the filename, and others ask specifically for a scss-lint.yml file.

Anyone have a quick tutorial on how to get set up?

Thanks! :slight_smile:

Hey @davebowker - been a while since I’ve used Atom, but I would probably use the base linter package for the core functionality, and then add language-specific support with linter-eslint, linter-stylelint, and linter-php.

linter-eslint and linter-stylelint are just interfaces for ESLint and Stylelint, respectively, which means you can pretty much configure those linters the same way you would without Atom being in the picture.

Sage places its Stylelint config in package.json and its ESlint config in .eslintrc.js. If you want to customize those, that’s where I would do it. Those are both standard locations and should work out of the box with the above plugins.

For general info on using Stylelint and ESLInt:

For linter-php to work you need to have PHP installed and you may need to tell Atom where to find it if it can’t detect it in your paths. Once it can find PHP, I think that’s all it needs in order to work.

If you want to go a step further and check your code against the coding standards Sage users, you could instead use linter-phpcs. https://atom.io/packages/linter-phpcs

If the above doesn’t get you where you want to be, you may want to hop over to the Atom community or the repos for one of those plugins to get more in-depth support.

@mmirus Thanks! That’s fantastic. I had a couple of linter plugins installed but each kept on asking for a config that wasn’t included with Sage! That plugin though seems to pick up some of the errors I was running into when building for production. Many thanks! :slight_smile:

1 Like