文章目录
-
- 前言
- 核心机制
- [🔧 各语言解析方式](#🔧 各语言解析方式)
-
- [1. Go - gopls](#1. Go - gopls)
- [2. JavaScript/TypeScript - typescript-language-server](#2. JavaScript/TypeScript - typescript-language-server)
- [3. Vue - volar (Vue Language Server)](#3. Vue - volar (Vue Language Server))
- [4. HTML - vscode-html-languageservice](#4. HTML - vscode-html-languageservice)
- [5. Java - jdtls (Eclipse JDT Language Server)](#5. Java - jdtls (Eclipse JDT Language Server))
- [🎯 SymbolKind 标准（LSP 规范）](#🎯 SymbolKind 标准（LSP 规范）)
- [🔄 解析流程](#🔄 解析流程)
- [📊 各语言 Language Server 对比](#📊 各语言 Language Server 对比)
前言
VSCode 使用 Language Server Protocol (LSP) 和内置解析器来为不同语言提供大纲视图。以下是各语言的近似解析方式：
核心机制
📋 核心机制：LSP textDocument/documentSymbol
所有语言都通过 LSP 的 textDocument/documentSymbol 请求获取符号信息。
请求格式：
json
{
"jsonrpc": "2.0",
"method": "textDocument/documentSymbol",
"params": {
"textDocument": {
"uri": "file:///path/to/file.go"
}
}
}响应格式：
json
[
{
"name": "MyFunction",
"kind": 12, // Function
"range": { "start": { "line": 10, "character": 0 }, ... },
"selectionRange": { "start": { "line": 10, "character": 5 }, ... },
"children": [...]
}
]🔧 各语言解析方式
1. Go - gopls
Language Server: gopls (官方 Go Language Server)
安装：
bash
go install golang.org/x/tools/gopls@latest解析内容：
go
// 结构体
type User struct {
Name string // Field
Age int // Field
}
// 方法
func (u *User) GetName() string { ... } // Method
// 函数
func main() { ... } // Function
// 接口
type Handler interface {
Handle() error // Method
}
// 常量
const MaxSize = 100 // Constant
// 变量
var globalVar int // VariableSymbolKind 映射：
Package = 4
Struct = 23
Interface = 11
Function = 12
Method = 6
Field = 8
Constant = 14
Variable = 132. JavaScript/TypeScript - typescript-language-server
Language Server: typescript-language-server + tsserver
安装：
bash
npm install -g typescript-language-server typescript解析内容：
javascript
// 类
class User {
constructor(name) { ... } // Constructor
getName() { ... } // Method
name = ''; // Property
}
// 函数
function main() { ... } // Function
// 箭头函数
const handler = () => { ... } // Variable
// 对象
const config = {
host: 'localhost', // Property
port: 3000 // Property
}
// 接口 (TypeScript)
interface IUser {
name: string; // Property
getName(): string; // Method
}SymbolKind 映射：
Class = 5
Method = 6
Property = 7
Function = 12
Variable = 13
Constructor = 9
Interface = 113. Vue - volar (Vue Language Server)
Language Server: @vue/language-server (Volar)
安装：
bash
npm install -g @vue/language-server解析内容：
vue
<template>
<!-- 不解析模板内容 -->
</template>
<script setup lang="ts">
// 解析 <script> 中的 TypeScript/JavaScript
import { ref, computed } from 'vue'
// 变量
const count = ref(0) // Variable
// 计算属性
const doubled = computed(() => count.value * 2) // Variable
// 函数
const increment = () => { ... } // Variable (函数表达式)
// 类型
interface User {
name: string // Property
}
</script>
<style scoped>
/* 不解析样式 */
</style>特点：
只解析 script 和 script setup 部分
使用 TypeScript 解析器
不解析 template 和 style
4. HTML - vscode-html-languageservice
Language Server: 内置 HTML Language Service
解析内容：
html
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title> <!-- 不解析 -->
</head>
<body>
<div id="app"> <!-- 解析 id -->
<h1>Title</h1> <!-- 不解析 -->
</div>
<script>
function init() { ... } <!-- 解析 JS 函数 -->
</script>
</body>
</html>解析策略：
解析 id 属性作为符号
解析 script> 中的 JavaScript
解析 style> 中的 CSS 选择器
SymbolKind：
id 属性 = String (15)
script> 函数 = Function (12)5. Java - jdtls (Eclipse JDT Language Server)
Language Server: eclipse.jdt.ls
安装：
通过 VSCode 扩展自动安装
Extension: "Language Support for Java(TM) by Red Hat"解析内容：
java
// 包
package com.example; // Package
// 导入
import java.util.List; // 不显示
// 类
public class User { // Class
// 字段
private String name; // Field
private int age; // Field
// 构造函数
public User(String name) { // Constructor
this.name = name;
}
// 方法
public String getName() { // Method
return name;
}
// 静态方法
public static void main(String[] args) { // Method
// ...
}
}
// 接口
interface IHandler { // Interface
void handle(); // Method
}
// 枚举
enum Status { // Enum
ACTIVE, // EnumMember
INACTIVE // EnumMember
}SymbolKind 映射：
Package = 4
Class = 5
Method = 6
Field = 8
Constructor = 9
Interface = 11
Enum = 10
EnumMember = 22🎯 SymbolKind 标准（LSP 规范）
typescript
export enum SymbolKind {
File = 1,
Module = 2,
Namespace = 3,
Package = 4,
Class = 5,
Method = 6,
Property = 7,
Field = 8,
Constructor = 9,
Enum = 10,
Interface = 11,
Function = 12,
Variable = 13,
Constant = 14,
String = 15,
Number = 16,
Boolean = 17,
Array = 18,
Object = 19,
Key = 20,
Null = 21,
EnumMember = 22,
Struct = 23,
Event = 24,
Operator = 25,
TypeParameter = 26
}🔄 解析流程
- 用户打开文件
↓ - VSCode 识别文件类型（通过扩展名）
↓ - 激活对应的 Language Server
↓ - 发送 textDocument/didOpen 通知
↓ - 请求 textDocument/documentSymbol
↓ - Language Server 解析文件
↓ - 返回符号列表（带层级结构）
↓ - VSCode 渲染大纲视图
📊 各语言 Language Server 对比
语言 Language Server 安装方式 解析能力
Go gopls go install ⭐⭐⭐⭐⭐ 完整
JavaScript typescript-language-server npm install -g ⭐⭐⭐⭐⭐ 完整
TypeScript typescript-language-server npm install -g ⭐⭐⭐⭐⭐ 完整
Vue @vue/language-server npm install -g ⭐⭐⭐⭐ 仅 script
HTML vscode-html-languageservice 内置 ⭐⭐⭐ 基础
Java eclipse.jdt.ls VSCode 扩展 ⭐⭐⭐⭐⭐ 完整
Python pylsp / pyright pip install ⭐⭐⭐⭐⭐ 完整
Rust rust-analyzer 自动安装 ⭐⭐⭐⭐⭐ 完整
C/C++ clangd 手动安装 ⭐⭐⭐⭐⭐ 完整