adding-new-languages.md

 1# Adding New Languages to Zed
 2
 3## LSP
 4
 5Zed uses the [Language Server Protocol](https://microsoft.github.io/language-server-protocol/) to provide language support. This means, in theory, we can support any language that has an LSP server.
 6
 7## Syntax Highlighting
 8
 9### Defining syntax highlighting rules
10
11We use tree-sitter queries to match certain properties to highlight.
12
13#### Simple Example:
14
15```scheme
16(property_identifier) @property
17```
18
19```ts
20const font: FontFamily = {
21  weight: "normal",
22  underline: false,
23  italic: false,
24};
25```
26
27Match a property identifier and highlight it using the identifier `@property`. In the above example, `weight`, `underline`, and `italic` would be highlighted.
28
29#### Complex example:
30
31```scheme
32(_
33  return_type: (type_annotation
34    [
35      (type_identifier) @type.return
36      (generic_type
37          name: (type_identifier) @type.return)
38    ]))
39```
40
41```ts
42function buildDefaultSyntax(colorScheme: Theme): Partial<Syntax> {
43  // ...
44}
45```
46
47Match a function return type, and highlight the type using the identifier `@type.return`. In the above example, `Partial` would be highlighted.
48
49#### Example - Typescript
50
51Here is an example portion of our `highlights.scm` for TypeScript:
52
53```scheme
54; crates/zed/src/languages/typescript/highlights.scm
55
56; Variables
57
58(identifier) @variable
59
60; Properties
61
62(property_identifier) @property
63
64; Function and method calls
65
66(call_expression
67  function: (identifier) @function)
68
69(call_expression
70  function: (member_expression
71    property: (property_identifier) @function.method))
72
73; Function and method definitions
74
75(function
76  name: (identifier) @function)
77(function_declaration
78  name: (identifier) @function)
79(method_definition
80  name: (property_identifier) @function.method)
81
82; ...
83```