Skip to content

Commit 7cf6d8d

Browse files
authored
docs: add Zed integration details to IDE documentation (#1455)
resolves #826
1 parent f7f0ccb commit 7cf6d8d

1 file changed

Lines changed: 56 additions & 1 deletion

File tree

docs/guide/ide-integration.md

Lines changed: 56 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# IDE Integration
22

3-
Vite+ supports VS Code through the [Vite Plus Extension Pack](https://marketplace.visualstudio.com/items?itemName=VoidZero.vite-plus-extension-pack) and the VS Code settings that `vp create` and `vp migrate` can automatically write into your project.
3+
Vite+ supports VS Code and Zed through editor-specific settings that `vp create` and `vp migrate` can automatically write into your project.
44

55
## VS Code
66

@@ -46,3 +46,58 @@ To let the VS Code NPM Scripts panel run scripts through `vp`, add the following
4646
```
4747

4848
This is included automatically by `vp create` but not by `vp migrate`, since existing projects may have team members who do not have `vp` installed locally.
49+
50+
## Zed
51+
52+
For the best Zed experience with Vite+, install the [oxc-zed](https://github.com/oxc-project/oxc-zed) extension from the Zed extensions marketplace. It provides formatting and linting via `vp check`.
53+
54+
When you create or migrate a project, Vite+ prompts you to choose whether you want the editor config written for Zed.
55+
56+
You can also manually set up the Zed config:
57+
58+
`.zed/settings.json`
59+
60+
```json
61+
{
62+
"lsp": {
63+
"oxlint": {
64+
"initialization_options": {
65+
"settings": {
66+
"run": "onType",
67+
"fixKind": "safe_fix",
68+
"typeAware": true,
69+
"unusedDisableDirectives": "deny"
70+
}
71+
}
72+
},
73+
"oxfmt": {
74+
"initialization_options": {
75+
"settings": {
76+
"configPath": "./vite.config.ts",
77+
"run": "onSave"
78+
}
79+
}
80+
}
81+
},
82+
"languages": {
83+
"JavaScript": {
84+
"format_on_save": "on",
85+
"prettier": { "allowed": false },
86+
"formatter": [{ "language_server": { "name": "oxfmt" } }],
87+
"code_action": "source.fixAll.oxc"
88+
},
89+
"TypeScript": {
90+
"format_on_save": "on",
91+
"prettier": { "allowed": false },
92+
"formatter": [{ "language_server": { "name": "oxfmt" } }]
93+
},
94+
"Vue.js": {
95+
"format_on_save": "on",
96+
"prettier": { "allowed": false },
97+
"formatter": [{ "language_server": { "name": "oxfmt" } }]
98+
}
99+
}
100+
}
101+
```
102+
103+
Setting `oxfmt.configPath` to `./vite.config.ts` keeps editor format-on-save aligned with the `fmt` block in your Vite+ config. The full generated config covers additional languages (CSS, HTML, JSON, Markdown, etc.) — run `vp create` or `vp migrate` to get the complete file written automatically.

0 commit comments

Comments
 (0)