最近考虑把公司的常用代码用扩展处理成复用的, 照着文档处理了一遍.
Snippets 扩展
关于扩展的结构, 可以直接参考官方给出的示例, 一个 package.json 文件, 加上一个 Snippets 的 JSON 文件, 就算写完了:https://github.com/Microsoft/…
其中 Snippets 的定义大概是这样,
key 跟 description 只是介绍性文字
prefix 是 snippet 在自动补全当中的触发字段
body 当中的代码片段, 更开是换行
$1 ${1:placeholder} 这样的写法, 表示 Tab 控制的光标位置, 其中 $0 表示结束位置
{
“For_Loop”: {
“prefix”: “for”,
“body”: [
“for (const ${2:element} of ${1:array}) {“,
“\t$0”,
“}”
],
“description”: “For Loop”
}
}
复杂的例子就看别人写的扩展了:https://github.com/xabikos/vs…
VS 还支持一些复杂的功能, 直接看文档上:https://code.visualstudio.com…
安装扩展
安装扩展需要一个命令行工具, 在 package.json 所在目录运行:
npm install -g vsce
vsce package
这时会生成一个扩展名为 .vsix 的文件, 就可以通过 VS Code 的命令安装了:
code –install-extension my-extension-0.0.1.vsix
这一步也可以通过 VS Code 图形界面来完成:
发布扩展到市场
说的话大致步骤不麻烦, 大致上:
先到 https://dev.azure.com/ 上注册账号, 创建组织,
在 dev.azure 访问自己的 security 页面创建一个 token, 选中所有 Marketplace 权限,
在组织当中创建一个 creator, 命令行或者界面都能操作, 把 creator id 写进 package.json,
然后通过 publish 子命令发布 …
https://code.visualstudio.com…
不过 … 实际操作挺多坑的, 网络有时候不好, 提示也不明确, 我浪费了不少的时间查原因.
结尾
VS Code 用支持 .vscodeignore, 也支持 icon, 结构跟 npm 模块也类似.
最后是我厂的 Snippet 代码, 目前功能很少, 后续慢慢扩展:https://github.com/jimengio/j…