Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
57 changes: 56 additions & 1 deletion docs/guide/ide-integration.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# IDE Integration

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.
Vite+ supports VS Code and Zed through editor-specific settings that `vp create` and `vp migrate` can automatically write into your project.

## VS Code

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

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.

## Zed

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`.

When you create or migrate a project, Vite+ prompts you to choose whether you want the editor config written for Zed.

You can also manually set up the Zed config:

`.zed/settings.json`

```json
{
"lsp": {
"oxlint": {
"initialization_options": {
"settings": {
"run": "onType",
"fixKind": "safe_fix",
"typeAware": true,
"unusedDisableDirectives": "deny"
}
}
},
"oxfmt": {
"initialization_options": {
"settings": {
"configPath": "./vite.config.ts",
"run": "onSave"
}
}
}
},
"languages": {
"JavaScript": {
"format_on_save": "on",
"prettier": { "allowed": false },
"formatter": [{ "language_server": { "name": "oxfmt" } }],
"code_action": "source.fixAll.oxc"
},
"TypeScript": {
"format_on_save": "on",
"prettier": { "allowed": false },
"formatter": [{ "language_server": { "name": "oxfmt" } }]
},
"Vue.js": {
"format_on_save": "on",
"prettier": { "allowed": false },
"formatter": [{ "language_server": { "name": "oxfmt" } }]
}
}
}
Comment thread
fengmk2 marked this conversation as resolved.
```

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.
Loading