Visual Studio Code

(重定向自VS Code

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

VS Code 是基于 GitHubElectron开源框架开发。Electron 是一个基于 Chromium 的项目,可用于开发基于 Node.js 的本地应用程序。Visual Studio Code 使用 Blink 排版引擎渲染用户界面。

简介

时间轴

安装

VS Code由两种使用方式:

  • 使用VS Code 客户端界面。
  • 安装web版服务器,在浏览器中使用。

客户端

web服务器

基础知识

打开面板

名称 快捷键 描述
命令面板 Ctrl+Shift+P
F1
快速打开 Ctrl+P 搜索文件,最近文件,打开文件
新窗口 Ctrl+Shift+N 开启一个新的VScode窗口。关闭窗口可以用右上角x图标,也可以Ctrl+Shift+W
扩展 Extensions Ctrl+Shift+X 也可以点击界面左侧Extensions图标打开
集成终端 Integrated Terminal Ctrl+`
Ctrl+Shift+`
Ctrl+Shift+`是开启一个新终端。

在终端可以使用:
Shift+PgUp/PgDn 上下翻页
Ctrl+Home/End 滚动到顶部或底部
用户设置 User Settings Ctrl+,
快捷键设置 Ctrl+K Ctrl+S 查看和设置快捷键

了解更多 >> VS Code 文档:提示和技巧


文本编辑

名称 快捷键 描述
剪切行 Ctrl+X 当不选择任何字符,剪切光标所在行
复制行 Ctrl+C 当不选择任何字符,复制光标所在行
向上移动行
向下移动行
Alt+↑
Alt+↓
向上复制粘贴行
向下复制粘贴行
Shift+Alt+↑
Shift+Alt+↓
删除行 Ctrl+Shift+K
光标上方插入行
光标下方插入行
Ctrl+Enter
Ctrl+Shift+Enter
跳转到匹配的括号 Ctrl+Shift+\
行缩进
行减少缩进
Ctrl+]
Ctrl+[
光标移动到行首
光标移动到行尾
Home
End
光标移动到文档开头
光标移动到文档末尾
Ctrl + Home
Ctrl + End
显示滚动上移
显示滚动下移
Ctrl+↑
Ctrl+↓
光标不会移动,只移动文档显示界面
显示向上翻页
显示向下翻页
Alt+PgUp
Alt+PgDn
折叠代码块
展开代码块
Ctrl+Shift+[
Ctrl+Shift+]
折叠代码块(包括子代码块)
展开代码块(包括子代码块)
Ctrl+K Ctrl+[
Ctrl+K Ctrl+]
折叠所有代码块
展开所有代码块
Ctrl+K Ctrl+0
Ctrl+K Ctrl+J
其中0是数字零
添加注释行
取消注释行
Ctrl+K Ctrl+C
Ctrl+K Ctrl+U
添加注释行或取消注释行 Ctrl+/
添加注释块或取消注释块 Shift+Alt+A
自动换行 Alt+Z
行跳转 Ctrl+g 输入行号

了解更多 >> VS Code 文档:提示和技巧/编辑技巧


代码辅助

名称 快捷键 描述
提示 Ctrl+I
Ctrl+空格
其中I是字母。需要插件如IntelliCode、Pylance等
参数提示 Ctrl+Shift+空格
转到定义
显示定义
F12
Alt+F12
也可通过光标放到函数、变量、类名上,右键->Go to Definition或右键->Peek->Peek Definition。
显示引用 Shift+F12 也可通过光标放到函数、变量、类名上,右键->Go to Reference或右键->Peek->Peek Reference。
文档代码格式化 Alt+Shift+F
选中代码格式化 Ctrl+K Ctrl+F
重命名符号名 F12 在某个变量或函数定义时函数名上按F2重命名,文档中其他使用的名称会一起改变。
改变文档语言 Ctrl+K M

了解更多 >> VS Code 文档:提示和技巧/智能感知


查找替换

调试

名称 快捷键 描述
断点 F9 也可以在代码行号前面悬停点击红点添加断点。
运行调试或继续 F5
停止调试 Shift+F5
单步执行 Stop into F11 添加断点后,运行调试,在断点处按一下执行一行。

显示

名称 快捷键 描述
隐藏或展开侧边栏
Toggle Sidebar
Ctrl+B
隐藏或展开底部面板
Toggle Panel
Ctrl+J
全屏免打扰模式
Zen mode
Ctrl+K Z

技巧

HTML中代码块增加外部元素。

  • 使用ctrl+shift+p搜索wrap,会显示筛选的Emmet: Wrap with Abbreviation
  • 点击右边设置按钮,添加快捷键alt+shift+w
  • 使用:点击一下代码块开始的标签,按快捷键,弹出框中输入如div.table-responsive

插件

插件安装

常用插件

插件 作者 功能 描述 网站
Remote - SSH Microsoft 远程开发环境 通过SSH连接到远程服务器,可以操作远程计算机的文件和文件夹、运行命令和扩展等。
Remote - Containers Microsoft 远程容器开发环境
Docker Microsoft
SQLite Viewer Florian Klampfer qwtel.com
MySQL cweijan 数据库客户端 支持连接MySQL/MariaDB, PostgreSQL, SQLite, Redis and ElasticSearch数据库,
SFTP liximomo 同步本地目录和远程目录
Draw.io Integration Henning Dieterichs 集成Draw.io插件,可以使用.drawio.svg文件等文件放入markdown文件,又可以直接编辑。

编程语言

Python

相关插件

插件 作者 功能 描述 网站
IntelliCode 微软 AI辅助开发 多语言支持,代码提示补全,使用示例 VS Code 市场 IntelliCode 官网
Pylance 微软 代码辅助 代码提示补全,有时加载慢,要重启VS Code VS Code 市场


了解更多 >> VS Code 文档:语言/Python VS Code 文档:Python教程


设置

终端的默认目录

  • 打开您的项目文件夹或子目录以在 Visual Studio Code 中加载它。
  • 打开命令面板(Ctrl+Shift+P 或者在 macOS 上是 Command+Shift+P)。
  • 输入并选择 "Preferences: Open Workspace Settings" 以打开工作区设置。
  • 搜索terminal.integrated.cwd,设置为项目子目录/ 或 文本配置。
{
    "terminal.integrated.cwd": "/your/subdirectory/path"
}

资源

官网

相关教程

相关文章