VSCode
设置 snippet
选中文本，使用快捷键
可以设置 ctrl + q 快捷键（Show Code Actions）。
还可以使用 ctrl + i 快捷键，调出可以使用的 snippets。
md
{
// Place your global snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
// Placeholders with the same ids are connected.
// Example:
// "Print to console": {
// "scope": "javascript,typescript",
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
"标红选中文本": {
"scope": "markdown",
"prefix": "red",
"body": [
"<span class='text-red'>${TM_SELECTED_TEXT}$0</span>",
],
"description": "标红选中文本"
},
"创建 md 表格": {
"scope": "markdown,md",
"prefix": "md-table",
"body": [
"| | | |",
"| --- | --- | --- |",
"| | | |",
],
"description": "创建 md 表格"
},
"创建 html 表格": {
"scope": "markdown,md",
"prefix": "html-table",
"body": [
"<table>",
" <!-- 表头 -->",
" <thead>",
" <tr>",
" <th></th>",
" <th></th>",
" <th></th>",
" </tr>",
" </thead>",
" <!-- 表体 -->",
" <tbody>",
" <tr>",
" <td></td>",
" <td></td>",
" <td></td>",
" </tr>",
" </tbody>",
"</table>",
],
"description": "创建 html 表格"
}
}设置选项卡换行堆叠
搜索 wrapTabs。
常用快捷键
ddd.......
- ctrl + i 代码提示
- ctrl + p 快速搜索文件并跳转，添加
:可以跳转到指定行 - ctrl + shift + p 根据您当前的上下文访问所有可用命令
- ctrl + shift + c 在外部打开终端并定位到当前项目路径
- ctrl + 按键 1 左边的符号显示隐藏终端面板
- Ctrl + B 切换侧边栏
- Ctrl + \ 快速拆分文件编辑
- alt + 单机左键，在鼠标起始和结束位置添加多处光标
- alt + shift + 单击左键，范围选择多处光标
- alt + 上键或下键 将当前行或者选中的区域上移/下移一行
垂直标尺
在配置文件中添加如下配置，可以增加字符数标尺辅助线。也叫对齐线。
json
"editor.rulers": [40, 80, 100]如何滚轮缩放编辑器字体大小
搜索 Mouse Wheel Zoom，勾选设置。
如何在 vscode 中设置缩进值为 2 个字符
ctr + ,- 搜索 Tab Size，设置为 2
- 搜索 Detect Indentation（检测文件缩进自动设置对应缩进），设置为 false
设置光标不要光标不要闪烁
在设置中搜索 cursor，设置 Cursor Blinking（控制那个光标动画样式）为 solid。
设置 vscode 的终端默认为 git bash
vscode settings 搜索 shell windows，将 Terminal > Integrated > Default Profile > Windows 设置为 Git Bash。
Paste Image
插件 id：mushan.vscode-paste-image。
安装后，截图在 vscode 里按快捷键 ctr + alt + v 即可快速粘贴图片。 如果快捷键失效，也可以使用 ctr + shift + p 调出所有命令，选择 Paste Image。
然后在对插件进行设置，复制的图片该存放在哪里，url 该是什么规则。
下面简单说一下它的设置项：
- Base Path: 插入 md 中的 url 根路径。设置为 ${projectRoot}（在 vscode 中被打开的这个项目的路径）即可。
- Default Name: 粘贴的文件名。可以不设置。
- Name Prefix: 文件名前缀。可以不设置。
- Name Suffix: 文件名后缀。可以不设置。
- Path: 存放图片文件的地址路径。比如设置为
${projectRoot}/docs/public/img/。 -Prefix: 根路径前缀。设置为 / 即可。
这样就能方便的在 vscode 里复制粘贴图片啦。
设置 vscode 在 windows 窗口底部 tab 栏显示标签名称
vscode能设置在window窗口中显示的tab名字吗
是的，Visual Studio Code 可以设置在窗口标签中显示的文本，称为 "window.title"。可以在用户设置（Settings）中进行配置。
您可以按下 "Ctrl + ," 或者 "Cmd + ," 打开用户设置，然后搜索 "window.title"。在编辑器窗口的标题栏中，可以在文件名前或后添加文本，并使用变量来显示不同的信息，例如工作区名称、Git 分支名称等。
以下是一些常用的 window.title 配置示例：
显示文件名和工作区名称："${activeEditorShort}${separator}${rootName}"
显示文件名、Git 分支名称和工作区名称："${activeEditorShort}${separator}${gitBranch}${separator}${rootName}"
显示文件名和项目名称："${activeEditorShort}${separator}${projectName}"
您可以根据自己的需要和偏好进行配置。更多关于 Visual Studio Code 的设置和配置信息，请参考官方文档。vscode，搜索文件名，ctr+p
搜索字符，ctr+f，ctr+shift+f 搜索
vscode 内置 codeLens 功能
找到 ts 对应的 CodeLens 功能。开启之后，可以看见引用次数：references。
vscode 开启鼠标滚轮缩放字体大小设置
json
"editor.mouseWheelZoom": true
vscode 自带文件对比功能
首先保证两个文件在同一个 vscode 窗口内。然后在左侧目录树中选中一个文件，点击鼠标右键：
再选择另一个文件，点击 Compare with Selected 就会对比了。
快速启动 vscode
VsCode 安装后，会自动写入环境变量，终端输入 code 即可唤起 VsCode 应用程序。
Emmet
vscode 内置了对 Emmet 的支持，无需额外扩展。
div*3