원클릭으로
vscode-optional-service-injection
Pattern for VS Code tree views that consume optional services with graceful degradation
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
메뉴
Pattern for VS Code tree views that consume optional services with graceful degradation
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | vscode-optional-service-injection |
| description | Pattern for VS Code tree views that consume optional services with graceful degradation |
| domain | vscode-extensions |
| confidence | medium |
| source | earned |
VS Code tree views often need data from services that may not be available at activation time (e.g., API services requiring auth tokens, services built by other team members in parallel). The tree should work without the service and enhance when it becomes available.
Instead of requiring the service in the constructor, expose a setService() method. This allows the extension to wire the service when available without blocking tree view creation.
export class MyTreeProvider implements vscode.TreeDataProvider<MyItem> {
private optionalService: IMyService | undefined;
constructor(private dataProvider: DataProvider) {}
setService(service: IMyService): void {
this.optionalService = service;
}
}
When fetching optional data, check for service existence first, then wrap the call in try/catch to handle runtime failures (network errors, auth issues, etc.).
private async getOptionalItems(): Promise<MyItem[]> {
if (!this.optionalService) {
return [];
}
try {
const data = await this.optionalService.getData();
return data.map(d => this.createItem(d));
} catch {
return [];
}
}
Define the contract in models (not in the service file) so consumers can compile without the concrete implementation existing yet.
// src/models/index.ts
export interface IMyService {
getData(root: string): Promise<Map<string, MyData[]>>;
}
getChildren() — VS Code shows ugly error UIPatterns for building dashboard webviews with tabs and visualizations
{what this skill teaches agents}
Lightweight YAML frontmatter extraction from markdown files without external dependencies
Pattern for coordinating VS Code status bar updates with tree view and data provider refresh cycles
Pattern for building Node.js API clients with TTL-based caching and no external dependencies
CI pipeline patterns for VS Code extensions using GitHub Actions