如何为自定义JSON语言的VS Code扩展实现定义跳转功能？

To enable Ctrl+click navigation from source::[name] entries to their corresponding [name].json files, build a VS Code extension using the DefinitionProvider API. Here's the step-by-step implementation:

1. Set Up the Extension Project #

Initialize a new VS Code extension project with the Yeoman generator:

npm install -g yo generator-code
yo code

Select either TypeScript or JavaScript as the development language.

2. Build the Definition Provider #

Create a provider class to detect the source:: pattern, extract the target filename, and resolve its workspace path.

Example TypeScript Implementation: #

import * as vscode from 'vscode';
import * as path from 'path';

export class SourceDefinitionProvider implements vscode.DefinitionProvider {
    provideDefinition(document: vscode.TextDocument, position: vscode.Position): vscode.Definition | undefined {
        const wordRange = document.getWordRangeAtPosition(position);
        if (!wordRange) return;

        const word = document.getText(wordRange);
        const match = word.match(/source::(\w+)/);
        if (!match?.[1]) return;

        const targetFileName = `${match[1]}.json`;
        const workspaceRoot = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
        if (!workspaceRoot) return;

        const targetUri = vscode.Uri.file(path.join(workspaceRoot, targetFileName));
        return new vscode.Location(targetUri, new vscode.Position(0, 0));
    }
}

3. Register the Provider #

Update the extension's activation logic to register the provider for your target files (JSON or custom language):

import * as vscode from 'vscode';
import { SourceDefinitionProvider } from './sourceDefinitionProvider';

export function activate(context: vscode.ExtensionContext) {
    const provider = vscode.languages.registerDefinitionProvider(
        { scheme: 'file', language: 'json' }, // Replace 'json' with your custom language ID if needed
        new SourceDefinitionProvider()
    );
    context.subscriptions.push(provider);
}

export function deactivate() {}

4. Optional: Custom Language Support #

If your files use a custom extension (e.g., .myconfig), add language registration in package.json:

"contributes": {
    "languages": [
        {
            "id": "mycustomlang",
            "aliases": ["My Custom Config", "mycustomlang"],
            "extensions": [".myconfig"],
            "configuration": "./language-configuration.json"
        }
    ]
}

Update the provider's language parameter to 'mycustomlang' to target these files.

5. Test and Deploy #

• Press F5 to launch the extension development host and verify Ctrl+click navigation works.
• Package the extension with vsce package to generate a .vsix file for distribution.

Optimization Tips for Large Workspaces: #

• If target files are scattered in subdirectories, use vscode.workspace.findFiles with a glob pattern (e.g., **/${targetFileName}) instead of direct path joining.
• Cache resolved file paths to avoid repeated filesystem searches for frequent references.
• Adjust the regex pattern (e.g., /source::([\w-_.]+)/) to support special characters in filenames.

内容的提问来源于stack exchange，提问作者Phenomenal One