对vscode插件开发的过程和踩坑作个记录, 顺便附上插件地址.

更新

[2019-3-24]

Changed

  • 剔除h2、h3等小标题加粗符号

Added

  • 新增插件地址

环境部署

安装

1. Yeomen

项目生成器

2. generator-code

vscode官方的插件开发脚手架

1
npm install -g yo generator-code

生成

生成项目结构

1
yo code

更改git配置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
// .git/config
[core]
	repositoryformatversion = 0
	filemode = false
	bare = false
	logallrefupdates = true
	symlinks = false
	ignorecase = true
[remote "origin"]
	url = https://github.com/xxx/xxxxxx.git
	fetch = +refs/heads/*:refs/remotes/origin/*
[branch "master"]
	remote = origin
	merge = refs/heads/master

测试

  • F5
  • Ctrl + Shift + P
  • commandName

package.json

命令行绑定

通过ctrl+shift+p打开的命令行输入启动命令

1
2
3
4
5
6
7
8
9
10
11
"activationEvents": [
	"onCommand:extension.helloWorld",
],
"contributes": {
	"commands": [
		{
			"command": "extension.helloWorld",
			"title": "Hello World"
		}
	],
},

按键绑定

直接通过按键绑定

1
2
3
4
5
6
7
8
9
10
11
"activationEvents": [
	"onCommand:extension.fileposition"
],
"contributes": {
	"keybindings": [
		{
			"key": "Ctrl+F2",
			"command": "extension.fileposition"
		}
	]
},

常用API

按照namespace加以区分

window

window.showInformationMessage

右下角提示信息

1
window.showInfomationMessage(`string`);

window.createInputBox

创建全局输入框

1
const input: InputBox = window.createInputBox();

window.showInputBox

展示输入框

1
window.showInputBox(input);

task

env

commands

workspace

workspace.workspaceFolders

获取当前编辑器内的所有 工作区文件夹

1
const folders: vscode.WorkspaceFolder[] | undefined = workspace.workspaceFolders;

languages

scm

debug

extensions

错误集锦

Error: command failed with error code 2: error parsing glob ‘!​/node_modules/‘: invalid use of **; must be one path…

解决办法: : 在.vscode下的settings.json中分别对应添加node_modules项即可