Visual Studio Code 学习

Visual Studio Code是一个由微软开发,同时支持Windows 、 Linux和macOS等操作系统且开放源代码的代码编辑器,它支持测试,并内置了Git 版本控制功能,同时也具有开发环境功能,例如代码补全、代码片段和代码重构等。

文章使用平台 macOS Catalina 10.15.3

编辑器的基础点#

  1. 快捷键
  2. 语言与框架支持
  3. 工作流的选择和支持
  4. 支持用户写插件来定制功能

前三点是下限,最后一点是上限

界面介绍#

  1. 通过 F1 或者Cmd+Shift+P 可以打开 命令面板,然后在命令面板中快速搜索命令并且执行。
  2. 左边的竖栏则是文件管理、搜索、代码管理、debug、插件扩展等功能项。

在 命令面板 中,输入 shell,可以看到一个 installed code in PATH. 选项,选择安装后,就可以直接在 控制台 中用 code 指令完成相关 vscode 的快速操作了。而code的常见指令在code --help 中就可以看到。最简单的例子:code test.js,即创建一个test.js文件

快捷键#

  • Option + 左右方向键 : 把光标移动到当前单词的最前面。如果一直使用 Option 和方向键,那么光标移动的颗粒度就变成了单词,你就可以在文档中以单词为单位不停地移动光标了。
  • Option + 上下方向键 : 将当前行,或者当前选中的几行代码,在编辑器里上下移动。
  • Cmd + 左右方向键 :把光标移动到行首或者行末。
  • Cmd + 上下方向键 :把光标移动到文件的顶部或者尾部。
  • 组合 Shift : 在Option和Cmd的很多控制光标位置的快捷键中,组合加上Shift键,则会添加选中功能。
  • 组合 Delete : 与Shift同理。
  • Cmd + Shift + \ :当在{ }中是,会移动到{ }的括号前方或者后方。
  • Cmd + Shift + K : 删除当前行。
  • Cmd + X :剪切当前行。
  • Cmd + / : 注释当前行。
  • Option + Shift + 上下方向键 : 向上或下复制当前行。
  • Option + Shift + F : 格式化代码。
  • Cmd + P : 最近打开文件 + 搜索。
  • Cmd + Shift + O : 查看文件中所有的函数或者代码块。
  • Cmd + 鼠标 : 查看函数实现。
  • Ctrl + 减号 : 返回上一次访问的文件
  • F1 : 打开命令控制台
  • F2 : 统一修改所有的 函数名 或者 类名,方便重构
  • 自定义快捷键 :命令面板输入keyboard shortcuts 即可。

codesnippet#

代码片段是对常用代码的一个抽象,它保留了大部分不变的代码,然后把需要经常变动的部分,换成变量,这样等下次调用它的时候,只需要把这些变量换成我们需要的就可以了。

在命令控制台中输入 Configure User Snippets,然后选择需要设置 代码片段 的语言。

然后按照以下格式添加 CodeSnippet

1
2
3
4
5
6
7
8
"Print to console": {
"prefix": "log",
"body": [
"console.log('$1');",
"$2"
],
"description": "代码片段描述"
}
  1. prefix 是在编辑器中打出 该字符 就可以打出对应的 代码片段
  2. body 是代码片段 的内容
  3. description 是描述
  4. Print to console 是该 代码片段 的名字

参考#

VSCode 官方文档

VSCode 开发者文档

极客时间-玩转VSCode

Cocos Creator Tips

Comments

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×