在这篇文章中，我将介绍如何使用 Cursor 来实现一个 VSCode 插件，并以 代码行统计插件 为例展示其实现步骤。这个插件的主要功能是统计某个工作区内各类编程语言的代码行数、空行数等，并展示统计结果。

你可以在 GitHub 上查看完整的代码：。

插件功能介绍

这个 Code Line Counter 插件能够统计代码文件的总行数、代码行数、以及空行数。它支持多种语言，包括 JavaScript、TypeScript、Python 等。用户可以自定义统计范围和排除的文件或文件夹。

插件核心代码

以下是该插件的主要实现代码。

import * as vscode from "vscode"; import * as fs from "fs"; import * as path from "path"; import from "util"; import glob from "glob";

const globAsync = promisify(glob);

// 定义语言和文件扩展名的映射 const defaultLanguageExtensions: { [key: string]: string[] } = { JavaScript: [".js", ".jsx"], TypeScript: [".ts", ".tsx"], Python: [".py"], Java: [".java"], "C++": [".cpp", ".hpp", ".h"], };

interface CodeStats { totalLines: number; codeLines: number; blankLines: number; }

interface LanguageStats {

}

export function activate(context: vscode.ExtensionContext) { console.log("Code Line Counter 扩展已激活");

let countCodeLinesDisposable = vscode.commands.registerCommand(

"codeLineCounter.countCodeLines", () => countCodeLines() 

);

let countCodeLinesInFolderDisposable = vscode.commands.registerCommand(

"codeLineCounter.countCodeLinesInFolder", (folderUri: vscode.Uri) => countCodeLines([folderUri.fsPath]) 

);

context.subscriptions.push(countCodeLinesDisposable, countCodeLinesInFolderDisposable); console.log("countCodeLines 命令已注册"); }

async function countCodeLines(initialIncludeDirs: string[] = [])

const rootPath = workspaceFolders[0].uri.fsPath; const defaultSrcPath = path.join(rootPath, ‘src’);

const config = vscode.workspace.getConfiguration("codeLineCounter"); let includeDirs = config.get ("includeDirs") || []; let excludePatterns = config.get ("excludePatterns") || [];

includeDirs = […new Set([…initialIncludeDirs, …includeDirs])];

if (includeDirs.length === 0 && fs.existsSync(defaultSrcPath)) {

includeDirs = [defaultSrcPath]; 

}

const includeInput = await vscode.window.showInputBox({

prompt: "请输入要包含的目录（用逗号分隔）", value: includeDirs.join(", "), 

});

const excludeInput = await vscode.window.showInputBox({

prompt: "请输入要排除的模式（用逗号分隔）", value: excludePatterns.join(", "), 

});

if (includeInput !== undefined) {

includeDirs = includeInput.split(",").map(dir => dir.trim()); 

}

if (excludeInput !== undefined) {

excludePatterns = excludeInput.split(",").map(pattern => pattern.trim()); 

}

await config.update("includeDirs", includeDirs, vscode.ConfigurationTarget.Workspace); await config.update("excludePatterns", excludePatterns, vscode.ConfigurationTarget.Workspace);

const userDefinedLanguages = config.get<{ [key: string]: string[] }>("languageExtensions") || {}; const languageExtensions = { …defaultLanguageExtensions, …userDefinedLanguages };

if (includeDirs.length === 0) {

vscode.window.showErrorMessage("请指定要统计的目录。"); return; 

}

const stats: LanguageStats = {};

for (const dir of includeDirs) {

await countLinesInDirectory(dir, excludePatterns, stats, languageExtensions); 

}

displayResults(stats, includeDirs, excludePatterns); }

代码解析

1. 激活插件

在 activate 方法中注册了两个命令：countCodeLines 和 countCodeLinesInFolder，分别用于统计整个工作区的代码行数和某个文件夹的代码行数。

export function activate(context: vscode.ExtensionContext) { let countCodeLinesDisposable = vscode.commands.registerCommand(

"codeLineCounter.countCodeLines", () => countCodeLines() 

);

context.subscriptions.push(countCodeLinesDisposable); }

2. 统计代码行数

countCodeLines 方法是代码行统计的核心功能。它从工作区中获取目录，读取目录下的文件，并根据文件的扩展名确定编程语言，统计每个文件的总行数、代码行数、和空行数。

async function countCodeLines(initialIncludeDirs: string[] = []) { // 获取工作区目录和用户输入的包含目录、排除模式 const includeDirs = ["src", "lib"]; // 示例目录 const stats: LanguageStats = {};

for (const dir of includeDirs) {

await countLinesInDirectory(dir, ["/node_modules/"], stats, defaultLanguageExtensions); 

}

displayResults(stats, includeDirs, ["/node_modules/"]); }

3. 结果展示

displayResults 函数将统计结果以弹窗的形式展示给用户。

function displayResults(stats: LanguageStats, includeDirs: string[], excludePatterns: string[]): void { let message = "代码行统计结果:

";

message += "包含的文件夹: "; includeDirs.forEach(dir => message += - ${dir} ); message += " 排除的模式: "; excludePatterns.forEach(pattern => message += ` - ${pattern}

`);

Object.entries(stats).forEach(([language, { totalLines, codeLines, blankLines }]) => {

message += `${language}: 

总行数: \({totalLines} 代码行: \){codeLines} 空行: ${blankLines}

`; });

vscode.window.showInformationMessage(message); }

扩展功能

• 语言扩展配置：用户可以通过 settings.json 来扩展插件支持的编程语言和对应的文件扩展名。
• 排除模式：用户可以通过输入框选择排除特定目录或文件模式（例如 node_modules）。

插件开发工具

安装依赖

插件的开发使用了以下工具：

在开始开发之前，使用 pnpm 安装依赖：

pnpm install

发布插件

发布插件到 VSCode Marketplace 之前，确保你已经安装了 vsce 工具，并执行以下命令：

vsce publish

结论

通过这篇文章，我们了解了如何使用 Cursor 实现一个 VSCode 插件。这个插件的主要功能是统计工作区中的代码行数，并支持多语言扩展。你可以在 查看完整的代码和更多细节。