Vue
Vue support.
How to install
With Forge Super installed, the button above opens the app on this extension, where you press Install. Nothing is installed until you do.
You can also open the Extensions panel in the app and search for Vue. The extension's id is vue.
Don't have Forge Super yet? Download it here.
README
From the extension's repository, written by its authors and not by Mentenaz. See the source.
Zed Vue
Development
To develop this extension, see the Developing Extensions section of the Zed docs.
Initialization Options
Specifying location of TypeScript SDK
By default, this extension assumes that you are working in a project with a node_modules directory, and searches for
the TypeScript SDK inside that directory.
This may not always be true; for example, when working in a project that uses Yarn PnP, there is no node_modules. For
editor support, the documented approach is to run something like
yarn dlx @yarnpkg/sdks. In that case, you can provide the following initialization options in your Zed settings:
{
"lsp": {
"vue": {
"initialization_options": {
"typescript": {
"tsdk": ".yarn/sdks/typescript/lib"
}
}
}
}
}
Settings Options
lsp.vue.settings is passed through to the Vue language server (Volar / vuejs/language-tools). The following settings are enabled by default:
{
"lsp": {
"vue": {
"settings": {
// Display inlay hints for the `$event` parameter in inline event handlers.
"vue.inlayHints.inlineHandlerLeading": true,
// Display hints when required component props are missing in templates.
"vue.inlayHints.missingProps": true,
// Display inlay hints for patterns that wrap component options.
"vue.inlayHints.optionsWrapper": true,
// Display inlay hints related to `v-bind` shorthand (`:`).
"vue.inlayHints.vBindShorthand": true,
},
},
},
}
You can find the upstream settings configuration schema here.
[!NOTE] Some settings (e.g.
vue.editor.focusMode) may not take effect.