vuejs / language-tools
⚡ High-performance Vue language tooling based-on Volar.js
AI Architecture Analysis
This repository is indexed by RepoMind. By analyzing vuejs/language-tools in our AI interface, you can instantly generate complete architecture diagrams, visualize control flows, and perform automated security audits across the entire codebase.
Our Agentic Context Augmented Generation (Agentic CAG) engine loads full source files into context, avoiding the fragmentation of traditional RAG systems. Ask questions about the architecture, dependencies, or specific features to see it in action.
Repository Summary (README)
PreviewVue Language Tools
<p> <a href="https://marketplace.visualstudio.com/items?itemName=Vue.volar"><img src="https://img.shields.io/visual-studio-marketplace/v/Vue.volar?labelColor=18181B&color=1584FC" alt="Version"></a> <a href="https://marketplace.visualstudio.com/items?itemName=Vue.volar"><img src="https://img.shields.io/visual-studio-marketplace/i/Vue.volar?labelColor=18181B&color=1584FC" alt="Downloads"></a> <a href="https://github.com/vuejs/language-tools/blob/master/LICENSE"><img src="https://img.shields.io/github/license/vuejs/language-tools.svg?labelColor=18181B&color=1584FC" alt="License"></a> </p>⚡ Vue language toolset with native TypeScript performance based-on Volar.js
💬 #language-tools on our Discord Server
Quick Start
For VSCode Users
Install the Vue (Official) extension to get full Vue language support.
Command-Line Type Checking
npm install vue-tsc typescript --save-dev
{
"scripts": {
"type-check": "vue-tsc --noEmit"
}
}
Packages
For End Users
| Package | Description |
|---|---|
| Vue (Official) | Vue, Vitepress, petite-vue language support extension for VSCode |
| vue-tsc | Type-check and dts build command line tool |
For Editor Integration
| Package | Description |
|---|---|
| @vue/language-server | The language server itself |
| @vue/language-service | Language service plugin collection |
| @vue/typescript-plugin | TypeScript language service plugin |
Core Module
| Package | Description |
|---|---|
| @vue/language-core | SFC parsing and virtual code generation |
Helper Tools
| Package | Description |
|---|---|
| vue-component-meta | Component props, events, slots types information extract tool |
| vue-component-type-helpers | Component type helper utilities |
| @vue/language-plugin-pug | Pug template support |
Community Integration
yaegassy/coc-volar
Vue language client for coc.nvim
neovim/nvim-lspconfig
Vue language server configuration for Neovim, check documentation here to set it up.
mattn/vim-lsp-settings
Vue language server auto configuration for vim-lsp
sublimelsp/LSP-volar
Vue language client for Sublime
kabiaa/atom-ide-volar
Vue language client for Atom
emacs-lsp/lsp-mode (jadestrong/lsp-volar)
Vue language client for Emacs
tommasongr/nova-vue
Vue language client for Nova
xiaoxin-sky/lapce-vue
Vue language client for Lapce
Kingwl/monaco-volar
Vue language support for Monaco on Browser
WebStorm
Built-in integration for @vue/language-server
Eclipse WildWebDeveloper
Vue language server configuration for Eclipse
vueCompilerOptions
Configure Vue compiler options in tsconfig.json:
{
"compilerOptions": { /* ... */ },
"vueCompilerOptions": {
"target": 3.5,
"strictTemplates": true
}
}
For detailed options, please refer to the @vue/language-core documentation.
Contribution Guide
If you want to work on the volar extension follow these commands to set up your local development environment.
🔎 Note that you will need pnpm - you can download it here: https://pnpm.io/installation.
git clone https://github.com/vuejs/language-tools.git
cd language-tools
pnpm install
npm run build
The recommended way to develop the volar extension is to use the Debug Tools provided by VSCode.
Alternatively, you can run one of the scripts defined in the package.json file.
❗ You should always use the debug launch configs or package.json scripts defined in the root of the project.
Additional info for contributing to open source projects can be found here: https://docs.github.com/en/get-started/quickstart/contributing-to-projects
To develop with upstream Volar.js modules, you can setup a workspace with https://github.com/volarjs/workspace.
❤️ Sponsors
This project is made possible thanks to our generous sponsors:
<p align="center"> <a href="https://cdn.jsdelivr.net/gh/johnsoncodehk/sponsors/sponsors.svg"> <img src="https://cdn.jsdelivr.net/gh/johnsoncodehk/sponsors/sponsors.png"/> </a> </p>License
MIT License