1---
2title: Elixir
3description: "Configure Elixir language support in Zed, including language servers, formatting, and debugging."
4---
5
6# Elixir
7
8Elixir support is available through the [Elixir extension](https://github.com/zed-extensions/elixir).
9
10- Tree-sitter Grammars:
11 - [elixir-lang/tree-sitter-elixir](https://github.com/elixir-lang/tree-sitter-elixir)
12 - [phoenixframework/tree-sitter-heex](https://github.com/phoenixframework/tree-sitter-heex)
13- Language Servers:
14 - [elixir-lang/expert](https://github.com/elixir-lang/expert)
15 - [elixir-lsp/elixir-ls](https://github.com/elixir-lsp/elixir-ls)
16 - [elixir-tools/next-ls](https://github.com/elixir-tools/next-ls)
17 - [lexical-lsp/lexical](https://github.com/lexical-lsp/lexical)
18
19Furthermore, the extension provides support for [EEx](https://hexdocs.pm/eex/EEx.html) (Embedded Elixir) templates and [HEEx](https://hexdocs.pm/phoenix/components.html#heex) templates, a mix of HTML and EEx used by Phoenix LiveView applications.
20
21## Language Servers
22
23The Elixir extension offers language server support for ElixirLS, Expert, Next LS, and Lexical. By default, only ElixirLS is enabled. You can change or disable the enabled language servers in your settings ({#kb zed::OpenSettings}) under Languages > Elixir/EEx/HEEx or directly within your settings file.
24
25Some of the language servers can also accept initialization or workspace configuration options. See the sections below for an outline of what each server supports. The configuration can be passed in your settings file via `lsp.{language-server-id}.initialization_options` and `lsp.{language-server-id}.settings` respectively.
26
27Visit the [Configuring Zed](../configuring-zed.md#settings-files) guide for more information on how to edit your settings file.
28
29### Using ElixirLS
30
31ElixirLS can accept workspace configuration options.
32
33The following example disables [Dialyzer](https://github.com/elixir-lsp/elixir-ls#dialyzer-integration):
34
35```json [settings]
36 "lsp": {
37 "elixir-ls": {
38 "settings": {
39 "dialyzerEnabled": false
40 }
41 }
42 }
43```
44
45See the official list of [ElixirLS configuration settings](https://github.com/elixir-lsp/elixir-ls#elixirls-configuration-settings) for all available options.
46
47### Using Expert
48
49Enable Expert by adding the following to your settings file:
50
51```json [settings]
52 "languages": {
53 "Elixir": {
54 "language_servers": ["expert", "!elixir-ls", "!next-ls", "!lexical", "..."]
55 },
56 "EEx": {
57 "language_servers": ["expert", "!elixir-ls", "!next-ls", "!lexical", "..."]
58 },
59 "HEEx": {
60 "language_servers": ["expert", "!elixir-ls", "!next-ls", "!lexical", "..."]
61 }
62 }
63```
64
65Expert can accept workspace configuration options.
66
67The following example sets the minimum number of characters required for a project symbol search to return results:
68
69```json [settings]
70 "lsp": {
71 "expert": {
72 "settings": {
73 "workspaceSymbols": {
74 "minQueryLength": 0
75 }
76 }
77 }
78 }
79```
80
81See the [Expert configuration](https://expert-lsp.org/docs/configuration/) page for all available options.
82
83To use a custom Expert build, add the following to your settings file:
84
85```json [settings]
86 "lsp": {
87 "expert": {
88 "binary": {
89 "path": "/path/to/expert",
90 "arguments": ["--stdio"]
91 }
92 }
93 }
94```
95
96### Using Next LS
97
98Enable Next LS by adding the following to your settings file:
99
100```json [settings]
101 "languages": {
102 "Elixir": {
103 "language_servers": ["next-ls", "!expert", "!elixir-ls", "!lexical", "..."]
104 },
105 "EEx": {
106 "language_servers": ["next-ls", "!expert", "!elixir-ls", "!lexical", "..."]
107 },
108 "HEEx": {
109 "language_servers": ["next-ls", "!expert", "!elixir-ls", "!lexical", "..."]
110 }
111 }
112```
113
114Next LS can accept initialization options.
115
116Completions are an experimental feature within Next LS, they are enabled by default in Zed. Disable them by adding the following to your settings file:
117
118```json [settings]
119 "lsp": {
120 "next-ls": {
121 "initialization_options": {
122 "experimental": {
123 "completions": {
124 "enable": false
125 }
126 }
127 }
128 }
129 }
130```
131
132Next LS also has an extension for [Credo](https://hexdocs.pm/credo/overview.html) integration which is enabled by default. You can disable this by adding the following section to your settings file:
133
134```json [settings]
135 "lsp": {
136 "next-ls": {
137 "initialization_options": {
138 "extensions": {
139 "credo": {
140 "enable": false
141 }
142 }
143 }
144 }
145 }
146```
147
148Next LS can also pass CLI options directly to Credo. The following example passes `--min-priority high` to it:
149
150```json [settings]
151 "lsp": {
152 "next-ls": {
153 "initialization_options": {
154 "extensions": {
155 "credo": {
156 "cli_options": ["--min-priority high"]
157 }
158 }
159 }
160 }
161 }
162```
163
164See the [Credo Command Line Switches](https://hexdocs.pm/credo/suggest_command.html#command-line-switches) page for more CLI options.
165
166### Using Lexical
167
168Enable Lexical by adding the following to your settings file:
169
170```json [settings]
171 "languages": {
172 "Elixir": {
173 "language_servers": ["lexical", "!expert", "!elixir-ls", "!next-ls", "..."]
174 },
175 "EEx": {
176 "language_servers": ["lexical", "!expert", "!elixir-ls", "!next-ls", "..."]
177 },
178 "HEEx": {
179 "language_servers": ["lexical", "!expert", "!elixir-ls", "!next-ls", "..."]
180 }
181 }
182```
183
184## Formatting without a language server
185
186If you prefer to work without a language server but would still like code formatting from [Mix](https://hexdocs.pm/mix/Mix.html), you can configure it as an external formatter by adding the following to your settings file:
187
188```json [settings]
189 "languages": {
190 "Elixir": {
191 "enable_language_server": false,
192 "format_on_save": "on",
193 "formatter": {
194 "external": {
195 "command": "mix",
196 "arguments": ["format", "--stdin-filename", "{buffer_path}", "-"]
197 }
198 }
199 },
200 "EEx": {
201 "enable_language_server": false,
202 "format_on_save": "on",
203 "formatter": {
204 "external": {
205 "command": "mix",
206 "arguments": ["format", "--stdin-filename", "{buffer_path}", "-"]
207 }
208 }
209 },
210 "HEEx": {
211 "enable_language_server": false,
212 "format_on_save": "on",
213 "formatter": {
214 "external": {
215 "command": "mix",
216 "arguments": ["format", "--stdin-filename", "{buffer_path}", "-"]
217 }
218 }
219 }
220 }
221```
222
223## Using the Tailwind CSS Language Server with HEEx templates
224
225To get all features (autocomplete, linting, and hover docs) from the [Tailwind CSS language server](https://github.com/tailwindlabs/tailwindcss-intellisense/tree/HEAD/packages/tailwindcss-language-server#readme) in HEEx templates, add the following to your settings file:
226
227```json [settings]
228 "lsp": {
229 "tailwindcss-language-server": {
230 "settings": {
231 "includeLanguages": {
232 "elixir": "html",
233 "heex": "html"
234 },
235 "experimental": {
236 "classRegex": ["class=\"([^\"]*)\"", "class='([^']*)'"]
237 }
238 }
239 }
240 }
241```
242
243With these settings, you will get completions for Tailwind CSS classes in HEEx templates. Examples:
244
245```heex
246<%!-- Standard class attribute --%>
247<div class="flex items-center <completion here>">
248 <p class="text-lg font-bold <completion here>">Hello World</p>
249</div>
250
251<%!-- With Elixir expression --%>
252<div class={"flex #{@custom_class} <completion here>"}>
253 Content
254</div>
255
256<%!-- With Phoenix function --%>
257<div class={class_list(["flex", "items-center", "<completion here>"])}>
258 Content
259</div>
260```
261
262## See also
263
264- [Erlang](./erlang.md)
265- [Gleam](./gleam.md)