文章目录
- 1、如何在VSCode插件webview中用d3-graphviz绘图
- 2、VSCode插件使用离线d3.min.js、d3-graphviz
- 3、使用 `@hpcc-js/wasm` 包在 Node.js 环境直接转换dot为svg
1、如何在VSCode插件webview中用d3-graphviz绘图
我来帮你创建一个 VS Code 插件示例，实现右键菜单触发 Webview 显示函数调用图的功能。
// package.json
{"name": "function-call-graph","displayName": "Function Call Graph","description": "Show function call graph in webview","version": "0.0.1","engines": {"vscode": "^1.80.0"},"categories": ["Other"],"activationEvents": [],"main": "./out/extension.js","contributes": {"commands": [{"command": "function-call-graph.showGraph","title": "Show Function Call Graph"}],"menus": {"editor/context": [{"command": "function-call-graph.showGraph","group": "navigation"}]}},"scripts": {"vscode:prepublish": "npm run compile","compile": "tsc -p ./"},"devDependencies": {"@types/vscode": "^1.80.0","@types/node": "^16.11.7","typescript": "^5.1.3"}
}// src/extension.ts
import * as vscode from 'vscode';export function activate(context: vscode.ExtensionContext) {let disposable = vscode.commands.registerCommand('function-call-graph.showGraph', () => {const panel 
