130
edits
DevTools/CodingStandards: Difference between revisions
Added ESLint sublimetext integration section
(New intro and ESLint section) |
(Added ESLint sublimetext integration section) |
||
| Line 11: | Line 11: | ||
* or [http://eslint.org/docs/user-guide/command-line-interface run it on the command line]. | * or [http://eslint.org/docs/user-guide/command-line-interface run it on the command line]. | ||
=== Running ESLint in SublimeText === | |||
SublimeText is a popular code editor and it supports ESLint via a couple of plugins. Here are some pointers to get started: | |||
* make sure you have [http://www.sublimetext.com/3 SublimeText '''3'''], the linter plugin doesn't work with ST2, | |||
* install [http://www.sublimelinter.com/en/latest/installation.html SublimeLinter 3], this is a framework for linters that supports, among others, ESLint, (installing SublimeLinter via [https://packagecontrol.io/installation Package Control] is the easiest way), | |||
* with SublimeLinter installed, you can now [https://github.com/roadhump/SublimeLinter-eslint#linter-installation install the specific ESLint plugin] (the installation instruction provide details about how to install node, npm, eslint which are required). | |||
Once done, open the mozilla project in SublimeText and open any JS file in either <code>/browser/devtools</code> or <code>/toolkit/devtools</code> (the 2 main directories for DevTools code). You can then trigger the linter via the contextual menu (right click on the file itself) or with a keyboard shortcut (ctrl+option+L on Mac). | |||
You should see errors and warnings in the gutter as shown in the screenshot below. You can also see all errors listed with ctrl+option+A, and individual errors by clicking in the gutter marker. | |||
[[File:eslint-sublimetext3.png|ESLint in SublimeText 3]] | |||
== Be consistent within a file! == | == Be consistent within a file! == | ||