Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[DOC] Add ESLint configuration steps for vscode #706

1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
/.idea/
*.iml
*.project
*.DS_Store

# Build directories
/node_modules/
Expand Down
27 changes: 24 additions & 3 deletions docs/development/ide-configuration.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,29 @@ When Gitpod IDE is started, the `npm install` command is launched automatically.

Install the EditorConfig extension. A configuration file already exists in the repository, so it will apply right after the extension installation.

#### [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)

After the installation, you need to explicitly tell to the ESLint extension to watch typscript files for linting errors.
- Open the Command Palette (*`View -> Command Palette`* or *`Ctrl+Shift+P`* or *`Shift+Cmd+P`*)
- Type `Open Settings (JSON)` and select the option `Preferences: Open Settings (JSON)`
- Paste this code inside the opened JSON file

```JSON
{
"eslint.validate": ["typescript"]
}
```
- Open the extensions panel (Button `Extensions` on the left toolbar or `Ctrl+Shift+X` or `Shift+Cmd+X`)
- Open the extensions settings of the ESLint extension (using the wheel on the bottom right corner of the extension)
- Ensure that the following properties are checked:
- `ESLint: Enable`
- `ESLint > Format: Enable`
- `ESLint > Lint Task: Enable`

Visual Studio Code is now configured correctly to use ESLint on typescript files.

*Note: make sure that ESLint is installed and [configured correctly to work with typescript](https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/README.md) on your machine.*

#### [Debugging TypeScript code](https://code.visualstudio.com/docs/typescript/typescript-debugging)
The `launch.json` file is already configured to execute tests:
- unit tests: `test:unit`
Expand All @@ -57,9 +80,7 @@ This extension permits visualizing .adoc files directly in VSCode.

#### [SonarLint](https://marketplace.visualstudio.com/items?itemName=SonarSource.sonarlint-vscode)

Additionally, it is advised to install the SonarLint extension.

It helps to avoid coding mistakes -> reduced technical debt.
SonarLint highlights Bugs and Security Vulnerabilities as you write code, with clear remediation guidance so you can fix them before the code is even committed.


### IntelliJ
Expand Down