控制台
@ 可查看当前文件的所有方法和变量(加个:可以排序
# 可在当前打开的所有文件中搜索方法和变量
> 控制台命令
: 快速去到当前文件的某一行
? 查看所有的快捷命令
操作技巧
善用内置快捷语法
比如输入for,会有提示
这种图标对应的JavaScript Language Basics,展开后如下图这样,有很多定位锚点,直接修改内容=>tab切换到下一个锚点=>修改内容,即可极快速完成很多事情!
重命名
选择某个变量,右键重命名或F2即可全部更改过来
快捷键
通用
Ctrl Tab 来回切换上方打开的标签页。
Ctrl W 关闭当前标签页。
Ctrl S 保存
Ctrl Z 撤销
Ctrl Y 重做
Ctrl F 查找,有个whole word选项可以开启精确匹配,并对Ctrl D选择重复项产生影响
Ctrl H 查找并替换
Ctrl N 新建文档
窗口相关
Ctrl B 开关侧边栏
Ctrl Shift E 侧边栏文件区(Explorer)
Ctrl Shift F 侧边栏搜索区(Find)(跨文件搜索
Ctrl Shift G 侧边栏Git管理(Git)
Ctrl Shift D 侧边栏调试区(Debug)
Ctrl 2 开启第二个分屏或切换到第二个分屏,配合其它数字同理(将某个分屏拉到比另一个大很多,然后控制台开启maximize editor group选项可以在切换分屏时自动放大当前屏
Ctrl ~ 在当前编辑文件的目录处唤起终端,当熟练使用系统cmd后转来用VS Code终端
Ctrl J 开关下侧栏,不一定开启终端
Ctrl K Z 开启zen模式
Ctrl - 或 + 缩小和放大界面
编辑相关
Ctrl L 选中当前行
Ctrl Shift K 删除当前行
Ctrl D 按一次选中当前光标对应单词,按两次以上继续匹配一样的单词
Alt按住 鼠标左键 同时出现多个光标
鼠标中键按住拖动 快速选择多行内容
Shift Ctrl [ 或 ] 开关代码块
Alt Up 或 Down 将该行和上一行或下一行调换顺序
Alt Shift Up 或 Down 将该行往上一行或下一行复制一份过去
Ctrl Alt Up 或 Down 新增光标
Ctrl [ 或 ] 增加或减少缩进。
Alt Shift F 格式化代码
F2 全局(跨文件)修改变量名
F8 逐个跳转至文件中的错误处并打开详细信息
Ctrl Space 在某些地方比如一个点后面,按这个可以调出代码智能提示(注意别和输入法切换冲突,可以通过系统设置添加英语语言,Alt Shift切换至英语输入后,该快捷键就不会唤起输入法
顺手插件
Better Comments
通过! ? *等符号,可以使注释带上颜色,方便突出重点内容。在settings.json可以自定义样式。
Quokka.js
可以通过Ctrl K Q来开启,在编辑器中提供一个实时反馈的环境,十分方便。(貌似仅支持JavaScript
settings.json常用配置
{
"editor.minimap.enabled": false, // 关闭编辑器迷你地图
"workbench.editor.enablePreview": false, // 点击文件默认在新窗口打开,而不是现窗口跳转
"workbench.colorTheme": "Monokai ST3", // 颜色主题,强烈推荐monokai,代码提示还挺智能的,有些场景比如找不到有某个方法就会显示不同的颜色以提醒用户
"emmet.triggerExpansionOnTab": true, // 只要按tab就会生成emmet代码块,而不需要在代码提示里找
"better-comments.tags": [ // better comments插件自定义注释的颜色即触发符号
{
"tag": "!",
"color": "#FF2D00",
"strikethrough": false,
"backgroundColor": "transparent"
},
{
"tag": "?",
"color": "#3498DB",
"strikethrough": false,
"backgroundColor": "transparent"
},
{
"tag": "//",
"color": "#474747",
"strikethrough": true,
"backgroundColor": "transparent"
},
{
"tag": "-",
"color": "#FF8C00",
"strikethrough": false,
"backgroundColor": "transparent"
},
{
"tag": "#",
"color": "#333",
"strikethrough": false,
"backgroundColor": "#98C379"
},
{
"tag": "@",
"color": "pink",
"strikethrough": false,
"backgroundColor": "rgba(0,0,0,.2)"
},
],
}