javascript.md

 1# JavaScript
 2
 3- Tree Sitter: [tree-sitter-javascript](https://github.com/tree-sitter/tree-sitter-javascript)
 4- Language Server: [typescript-language-server](https://github.com/typescript-language-server/typescript-language-server)
 5
 6### Code formatting
 7
 8Formatting on save is enabled by default for JavaScript, using TypeScript's built-in code formatting. But many JavaScript projects use other command-line code-formatting tools, such as [Prettier](https://prettier.io/). You can use one of these tools by specifying an _external_ code formatter for JavaScript in your settings. See the [configuration](../configuration/configuring-zed.md) documentation for more information.
 9
10For example, if you have Prettier installed and on your `PATH`, you can use it to format JavaScript files by adding the following to your `settings.json`:
11
12```json
13{
14  "language_overrides": {
15    "JavaScript": {
16      "format_on_save": {
17        "external": {
18          "command": "prettier",
19          "arguments": ["--stdin-filepath", "{buffer_path}"]
20        }
21      }
22    }
23  }
24}
25```
26
27### ESLint
28
29You can configure Zed to format code using `eslint --fix` by running the ESLint
30code action when formatting (requires Zed `0.125.0`):
31
32```json
33{
34  "languages": {
35    "JavaScript": {
36      "code_actions_on_format": {
37        "source.fixAll.eslint": true
38      }
39    }
40  }
41}
42```
43
44You can also only execute a single ESLint rule when using `fixAll`:
45
46```json
47{
48  "languages": {
49    "JavaScript": {
50      "code_actions_on_format": {
51        "source.fixAll.eslint": true
52      }
53    }
54  },
55  "lsp": {
56    "eslint": {
57      "settings": {
58        "codeActionOnSave": {
59          "rules": ["import/order"]
60        }
61      }
62    }
63  }
64}
65```
66
67**Note:** the other formatter you have configured will still run, after ESLint.
68So if your language server or prettier configuration don't format according to
69ESLint's rules, then they will overwrite what ESLint fixed and you end up with
70errors.
71
72#### Configure ESLint's `nodePath`:
73
74You can configure ESLint's `nodePath` setting (requires Zed `0.127.0`):
75
76```json
77
78{
79  "lsp": {
80    "eslint": {
81      "settings": {
82        "nodePath": ".yarn/sdks"
83      }
84    }
85  }
86}
87```