vuejs/vetur
Vetur
Vetur is a Visual Studio Code extension that provides comprehensive language support for Vue single-file components. It parses .vue files into separate template, script, and style regions, then delegates each region to its own language service for independent processing. This architecture enables IntelliSense, type-checking, formatting, and linting across all embedded languages within a Vue file.
The extension distinguishes itself through deep integration with Vue's component model. It infers TypeScript types for template expressions by analyzing component props, data, and computed properties, and validates prop signatures and types against declared definitions. Vetur also runs type-checking on Vue templates from the command line, catching type errors that Vue and TypeScript alone miss. For component libraries, it supports embedding tag and attribute definitions inside npm packages, ensuring version-matched auto-completion when users install those packages.
Beyond core editing features, Vetur handles multi-project workspace configuration for monorepos, resolves module aliases from Webpack or TypeScript path mappings, and integrates with Yarn Plug'n'Play. It provides syntax highlighting, Emmet abbreviation expansion, and per-language formatter selection for each embedded region. The extension also supports launching a Chrome debugger from the editor to set breakpoints and step through Vue component code during development.
