vscode 插件踩坑指南

1. 添加子菜单

最终效果

相关 issue

10172 和 9827

代码配置

1. explorerResourceIsFolder 代表该菜单仅在文件夹右键时展示
2. config.fileTemplate.ts.active 代表读取本地 setting 中的配置，true 时展示

// setting 配置
"fileTemplate": {
	"js": { "active": true },
	"ts": { "active": true },
	"go": { "active": true },
	"vue": { "active": true }
}

// 插件 package.json 中的配置
	"contributes": {
        "commands": [
            {
                "command": "customTsFileTemplate",
                "title": "自定义TS模板"
            },
        ],
        "menus": {
            "explorer/context": [
                {
                    "when": "explorerResourceIsFolder",
                    "submenu": "fileTemplate",
                    "group": "navigation"
                }
            ],
            "fileTemplate": [
                {
                    "when": "config.fileTemplate.ts.active",
                    "command": "customTsFileTemplate",
                    "group": "navigation"
                },
            ]
        },
        "submenus": [
            {
                "id": "fileTemplate",
                "label": "生成自定义代码模板"
            }
        ],
    },

2. 使用 when 时相关关键字

官方文档，使用如上

逻辑操作符

关键字（太多了，截图只是一部分，详情看看官方链接）

如下图 explorerResourceIsFolder 表示是否文件夹

3. 设置 vscode setting 配置

配置

只有配置 configuration 之后才可以使用本地 vscode setting 的配置

// package.json 中 contributes 中 configuration 配置举例
"configuration": {
    "title": "languageList",
    "properties": {
        "snippetType": {
            "type": "array",
            "default": [],
            "description": "select language to use \n js => .js .jsx \n ts => .ts .tsx \n vue => .vue \n go => .go"
        },
        "fileTemplate": {
            "type": "object",
            "default": {},
            "description": "select fileTemplate to use （ go js ts vue ）"
        }
    }
}

// vscode setting 中配置
"snippetType": [
    { "language": "js" },
    { "language": "ts" }
],
"fileTemplate": {
    "js": { "active": true },
    "ts": { "active": true },
    "go": { "active": true },
    "vue": { "active": true }
}

使用

插件中读取
const config = vscode.workspace.getConfiguration().get('snippetType');
when 中使用的时候读取
config.fileTemplate.ts.active