最新消息:XAMPP默认安装之后是很不安全的,我们只需要点击左方菜单的 "安全"选项,按照向导操作即可完成安全设置。

更友好的管理VSCODE代码片断

XAMPP下载 admin 597浏览 0评论
 写在前面
对于我这种严格依赖 VSCODE 的人来说,会更努力的寻找释放生产力的方式,而代码片断是我日常最常用的功能之一。

从官网的 Creating your own snippets 可以非常容易的构建自己代码片断库。然而维护一个需要保持特定代码格式的JSON文件是一件非常困难的事,特别是对于像我这种三天头可能就产生一个新的片断来说是一种噩梦。

Markdown
我想99%的程序员都离不开 Markdown,如果说将一个 Markdown 文件内容直接转换成一个代码片断应该来说是很优雅的形式,例如:

这是一个按钮

```html (注意 ` 应该是英文)
<button type=”${1|text,tel,email|}”>$0<tton>
```

 维护一些 Markdown 文件比维护一个JSON文件更酸爽。

vscode-snippet-generator
vscode-snippet-generator 可以快速做到这一点,而且非常简单。

快速入门
克隆一个管理 Markdown 文件的模板项目:

git clone –depth 1 https://github.com/cipchk/vscode-snippet-generator-tpl.git

在项目 src 目录下创建一个 button.md

,内容为上述。
生成一个 VSCODE 插件安装包:

npm run release
然后将这个 VSCODE 插件分享给团队其他成员,仅此而已。

cipchk-vscode 是我个人一个代码片断库,也是使用 vscode-snippet-generator 构建。
市场
如果你希望给你的开源项目提供一些片断,只需要将 package.json 相关信息变更为自己项目名称即可,最后可以将生成插件提交给VSCODE市场。

参数
vscode-snippet-generator 是一个命令行工具,它提供一些若干参数,这些参数你可以在命令行中指定,或在根目录创建一个名为 snippet-config.json 配置信息。

sourceRoot 指定 Markdown 文件根目录,默认:src
outFile 指定 JSON 输出路径,默认:./snippets.json
prefix 指定前缀
separator 指定多层级目前间用什么分隔符,默认:-
每一个代码片断触发是由 prefix 决定,而生成 prefix 的规则默认是根据目录及文件名结构,例如:

src
button
type.md

=> button-type,若有前缀:as-button-type
full.md

=> button-full,若有前缀:as-button-full
当然如果你愿意也可以通过一段 YAML 语法的头部文本来标记源文件,例如:


prefix: button
description: 按钮
scope: typescript,html

转载请注明:XAMPP中文组官网 » 更友好的管理VSCODE代码片断

您必须 登录 才能发表评论!