Skip to content

Settings Reference ​

Pre-Release

Verter is pre-release software. APIs may change between releases — see the API Stability document.

All VS Code extension settings for Verter, configurable via settings.json or the Settings UI.

General ​

SettingTypeDefaultDescription
verter.enablebooleantrueEnable or disable the Verter extension entirely
verter.lspBinaryPathstring""Absolute path to the verter-lsp binary. Leave empty to auto-detect (bundled binary or PATH).

Statistics ​

SettingTypeDefaultDescription
verter.statistics.enabledbooleanfalseCollect processing statistics (diagnostics, file reads)
verter.statistics.persistToFilebooleanfalsePersist statistics to disk for cumulative analysis
verter.statistics.filePathstring""Absolute path for persisted statistics. Defaults to <workspace>/.verter/statistics.json when persistence is enabled.
verter.statistics.maxSessionEntriesnumber500Maximum number of in-memory statistics events to retain per session
verter.statistics.maxPersistedEntriesnumber2000Maximum number of events persisted to disk

Analysis ​

SettingTypeDefaultDescription
verter.analysis.enabledbooleanfalseEnable the Verter Analysis sidebar (virtual files, component tree, analysis, source map sync)

Decorations ​

SettingTypeDefaultDescription
verter.decorations.vueApiCallsbooleantrueShow inline annotations for Vue API calls (lifecycle hooks, watchers, reactivity, provide/inject)
verter.decorations.bindingColorsbooleantrueShow faint color decorations on bindings based on their reactivity type (ref, computed, reactive, prop, etc.)
verter.decorations.bindingColorsScope"template" | "all""template"Where to apply binding color decorations. "template" colors bindings only in <template> (where they are consumed far from declarations). "all" colors bindings in both <template> and <script>.
verter.decorations.bindingColorsStyle"background" | "underline""background"Visual style for binding color decorations. "background" applies a faint background tint behind binding text. "underline" applies a subtle colored dotted underline beneath binding text.
verter.decorations.propConstnessbooleanfalseShow faint background decorations on component props based on their constness (const = optimizable, dynamic = needs tracking).

Binding Color Categories ​

Binding colors are determined by the reactivity type of each binding:

CategoryDescriptionDefault Color (Dark)
verter.binding.refref() bindings (needs .value)Blue #4285f4
verter.binding.computedcomputed() bindingsPurple #a142f4
verter.binding.reactivereactive() bindingsTeal #00bcd4
verter.binding.propdefineProps bindingsOrange #ff9800
verter.binding.composableComposable return values (MaybeRef)Pink #e91e63
verter.binding.mutableMutable (let) bindingsAmber #ffc107
verter.binding.functionFunction bindingsGreen #4caf50

When verter.decorations.propConstness is enabled, these additional colors apply:

CategoryDescriptionDefault Color (Dark)
verter.propConstness.constProps with constant values (optimizable)Green
verter.propConstness.dynamicProps with dynamic values (needs tracking)Orange

These colors are theme-aware and have separate defaults for dark, light, high contrast, and high contrast light themes. You can override them in your workbench.colorCustomizations settings:

json
{
  "workbench.colorCustomizations": {
    "verter.binding.ref": "#5599ff20",
    "verter.binding.computed": "#bb66ff20"
  }
}

MCP Server ​

SettingTypeDefaultDescription
verter.mcp.enabledbooleantrueSpawn the standalone verter-mcp HTTP server alongside the LSP, providing Vue analysis tools to AI agents
verter.mcp.portnumber0Port for the MCP HTTP endpoint. 0 (the default) auto-assigns a free port, which is then registered with VS Code's MCP provider API and mirrored into .mcp.json.
verter.mcp.lintPreset"essential" | "recommended" | "all" | "performance" | "a11y" | "strict""recommended"Lint preset for the MCP server's diagnostic tools
verter.mcp.claudeCodeNotificationbooleantrueShow a notification when Claude Code is detected with MCP setup instructions

See MCP Server for details on setup and available tools.

Type Provider ​

SettingTypeDefaultDescription
verter.typeProvider"auto" | "shared-tsgo" | "tsgo" | "tsserver" | "extension" | "off""auto"TypeScript type provider for Vue files. Changing this setting restarts the server.
verter.typescript.tsdkstring""Path to TypeScript SDK directory (e.g., node_modules/typescript/lib). Leave empty to auto-detect.

Provider modes:

ModeBehavior
autoDetects workspace TS version — if TS 5.x/6.x installed, uses tsserver and recommends TSGO; otherwise tries TSGO
shared-tsgoPrefer the exact editor-owned Native Preview Program; activate managed TSGO only after an observed attach failure
tsgoUses a separately managed TSGO process (operator override, native Go binary)
tsserverUses workspace TypeScript version (tsserver)
extensionHosts the TypeScript language service in the extension process (experimental). Resolution is per project: each project is served from the TypeScript it installed, so a monorepo package with its own version uses that version. "Installed" means the project's own node_modules chain and nothing else — unlike tsserver below, this mode has no global tier, so a TypeScript reachable only through NODE_PATH or a legacy global folder is a compiler the project never chose and is not used. There is no bundled fallback either — a project with no resolvable TypeScript, one whose install carries no lib.*.d.ts default libraries, or one on the native (7.x/tsgo) TypeScript this in-process service cannot drive, is not served, and Verter tells you what to install or which provider to pick. Sibling projects keep working
offDisables TypeScript type checking (verter-only mode)

verter.typescript.tsdk and TypeScript discovery ​

Leave verter.typescript.tsdk empty and the language server discovers TypeScript itself: the project-local install first (walking up from the owning project), then the configured tsdk, then a global install — refusing any candidate that ships no lib.*.d.ts default libraries, and failing with an actionable error when nothing resolves.

The extension no longer passes its own TypeScript as a default --tsdk. That copy was a complete, library-carrying install and did serve correctly, so this is a deliberate, bounded behaviour change rather than the removal of a broken path: it was a compiler the project never chose, silently pinned to whatever version the extension happened to ship. The one workspace shape affected is a project with neither a local nor a global TypeScript — previously served by the extension's copy, now told to install one or set verter.typescript.tsdk.

TSGO Limitation

TSGO has a known limitation: re-exported .vue components (e.g., barrel files like export { default as MyComp } from './MyComp.vue') may lose their typing when imported in another SFC. This is why auto mode defaults to tsserver when a workspace TypeScript installation is found. If you experience missing types with TSGO, switch to tsserver.

Server ​

SettingTypeDefaultDescription
verter.trace.server"off" | "messages" | "verbose""off"Traces the communication between VS Code and the Verter language server. Useful for debugging LSP issues.
verter.server.logLevel"error" | "warn" | "info" | "debug" | "trace""info"Log level for the Verter language server process. Changing this setting restarts the server.

Experimental ​

SettingTypeDefaultDescription
verter.experimental.conditionalRootNarrowingbooleanfalseGeneric narrowing for conditional root elements controlled by props (Vue). See Experimental Features.
verter.experimental.exposeBindingsTestingbooleanfalseIn test files, resolve Vue .vue imports to the VTU-style testing API (*.vue.__verter_test.ts) so <script setup> bindings are visible. Svelte has no testing virtual file — see below.
verter.experimental.strictSlotsbooleanfalseEnforce strict type checking for slot children against defineSlots().

exposeBindingsTesting (Vue + Svelte) ​

Vue and Svelte are both first-class. This setting is not Vue-only noise for Svelte users:

  • Vue: test importers (*.spec.ts, *.test.ts, __tests__/, …) use Foo.vue.__verter_test.ts (setup bindings visible; defineExpose does not narrow). Non-test importers stay on the public API.
  • Svelte: there is no Foo.svelte.__verter_test.ts. App and test importers share the same public component type. Enabling the flag does not invent a second Svelte instance shape.

Full detail: Experimental Features → Expose Bindings Testing.

Emmet Configuration ​

The extension automatically configures Emmet to include Vue in its language list:

json
{
  "emmet.includeLanguages": {
    "vue": "html"
  }
}

This enables Emmet abbreviation expansion inside Vue <template> blocks.

Example Configuration ​

A recommended configuration for development:

json
{
  "verter.enable": true,
  "verter.decorations.vueApiCalls": true,
  "verter.decorations.bindingColors": true,
  "verter.decorations.bindingColorsScope": "template",
  "verter.decorations.bindingColorsStyle": "background",
  "verter.server.logLevel": "info"
}

For debugging or extension development:

json
{
  "verter.enable": true,
  "verter.analysis.enabled": true,
  "verter.statistics.enabled": true,
  "verter.trace.server": "verbose",
  "verter.server.logLevel": "debug"
}

Released under the MIT License.