Confirmed users
45
edits
DevTools/CodingStandards: Difference between revisions
Mark outdated
m (Added missing instructions.) |
Digitarald (talk | contribs) (Mark outdated) |
||
| (8 intermediate revisions by 3 users not shown) | |||
| Line 1: | Line 1: | ||
{{outdated}} | |||
The DevTools JS code base is quite large, and a lot of different people contribute to it all the time, so it's important that a set of standards be shared when coding so that the code is consistent, written in a predictable style that also hopefully helps avoid common mistakes. | The DevTools JS code base is quite large, and a lot of different people contribute to it all the time, so it's important that a set of standards be shared when coding so that the code is consistent, written in a predictable style that also hopefully helps avoid common mistakes. | ||
| Line 52: | Line 54: | ||
<code> | <code> | ||
NOTE: Your local eslint binary is at | NOTE: Your local eslint binary is at | ||
/some | /some-project-path/node_modules/.bin/eslint | ||
"paths": { | "paths": { | ||
"linux": [], | "linux": [], | ||
"osx": [ | "osx": [ | ||
"/some | "/some-project-path/node_modules/.bin" | ||
], | ], | ||
"windows": [] | "windows": [ | ||
"C:\\some-project-path\\node_modules\\.bin" | |||
] | |||
}, | }, | ||
</code> | </code> | ||
| Line 103: | Line 107: | ||
=== Running ESLint in Atom === | === Running ESLint in Atom === | ||
./mach eslint --setup | From the root of the project type: | ||
<code>./mach eslint --setup</code> | |||
Install the [https://atom.io/packages/linter-eslint linter-eslint] package. Then go to the package settings and enable the following options: | Install the [https://atom.io/packages/linter-eslint linter-eslint] package v.8.00 or above. Then go to the package settings and enable the following options: | ||
[[File:Eslint-atom-settings.png|linter-eslint settings in Atom]] | [[File:Eslint-atom-settings.png|651px|linter-eslint settings in Atom]] | ||
Once done, you should see errors and warnings as shown in the screenshot below. | Once done, you should see errors and warnings as shown in the screenshot below. | ||
[[File:Eslint-atom.png| | [[File:Eslint-atom.png|651px|ESLint in Atom]] | ||
=== Running ESLint in ViM === | === Running ESLint in ViM === | ||
| Line 129: | Line 135: | ||
You probably need to close and reopen ViM for the changes to take effect. Then, open any file and try to edit it to cause an error, then save it. If all goes well, you will get some distinctive arrows pointing to the error. Hovering with the mouse will produce a sort of tooltip with more information about the error. | You probably need to close and reopen ViM for the changes to take effect. Then, open any file and try to edit it to cause an error, then save it. If all goes well, you will get some distinctive arrows pointing to the error. Hovering with the mouse will produce a sort of tooltip with more information about the error. | ||
=== Running ESLint in Visual Studio Code === | |||
From the root of the project type: | |||
<code>./mach eslint --setup</code> | |||
Install the [https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint dbaeumer.vscode-eslint] package. Then go to the package settings and set the following option: | |||
<code>"eslint.nodePath": "tools/lint/eslint/node_modules/.bin"</code> | |||
Once done, you should see errors and warnings as shown in the screenshot below. | |||
[[File:Vscode-eslint.png|600px|ESLint in VS Code]] | |||
=== Getting Rid of ESLint Errors === | === Getting Rid of ESLint Errors === | ||