之前笔者写过几篇关于vscode的文章 鱼和熊掌:VSCode+Vim ， VSCode Vim进阶操作，VSCode Vim进阶操作 没想到后来收到很多开发同仁的反馈。
今天我把最近vscode日常使用技巧分享出来,大部分是跟前端开发相关。
1. 编写scss
最近开始大量写前端页面，sass作为老牌的css预处理程序让css编写变得高效。 允许你使用 自定义变量, 嵌套，mixin 等众多功能， 并且完全兼容 CSS 语法。
vscode 对scss支持非常好，不光支持语法高亮，autocompletion 。通过Live Sass Compiler 这个插件可以watch scss文件动态生成css。
通过修改settings 来配置css输出规则。
"liveSassCompile.settings.formats": [
{
"format": "compressed",
// "extensionName": ".min.css",
"savePath": "/css/"
}
],
2. vim 编辑html
考虑到编写前端需要处理大量html,比如需要选中，复制，修改html标签相关的内容，普通的vim命令处理起来有些麻烦，这里介绍几个快捷命令：
- dit 删除标签内部的内容。
- cit 删除 标签内部的内容并切换到insert模式。
- yit 复制 标签内部的内容。
- vit 选中标签内部的内容。
- vat 选中标签以及内部的内容。
同理，如果要删除 修改 复制括号 () 引号内部的内容可以用i 模式。
di) yi) ci)
da) ya) ca) #通知删除 括号
3. vim 删除内容但不覆盖剪贴板
在编程的时候,通常我们需要把一段代码复制，然后删除一些内容后粘贴过去。
具体用vim 操作时候先通过 yy yw 等命令复制内容,然后需要 d 删除一些代码，此时原先复制的内容就会被覆盖掉。
好在vim当中有一个叫d 的命令， 代表black hole register, 搭配d 命令就可以删除内容但不覆盖剪贴板。
vscode 可以通过设置替换d 命令来实现这个功能。
{
"before": ["d"],
"after": [ "\"", "_", "d" ]
}
