主界面中的左侧侧边栏有几个比较重要的栏目,分别是文件管理、搜索、调试和插件管理。 1)文件管理。在这里可以对项目文件进行管理,其模式和pycharm、sublime等其他编辑器基本相同。 2)搜索。...侧边栏的搜索和ctrl+F略有不同,主要表现在它是对当前工作区(项目目录)内的所有文件进行搜索。...上面我们也讲到过,vscode只是一个代码编辑器而非集成开发环境,因此其本身是不具备编译功能的,那该如何管理它和本地的开发环境呢,没错还是要靠插件。...打开我们上面讲的插件管理侧边栏,在应用商店中搜索python返回的第一个结果就是我们需要的插件,下图是我安装完之后显示的画面。...首先来看侧边栏,就是在文章第一部分提到的调试功能界面,其中变量栏包含了vscode自动识别的程序变量 在监控栏可以自定义变量栏中没有的表达式,例如我们想实时监控i+j+k的值,就可以将表达式添加到这里;
1.编辑器与窗口管理相关快捷键: 新建文件: ctrl + n 文件之间的切换: ctrl + Tab 打开一个新的VSCode编辑器: ctrl + shift + n 关闭当前窗口: ctrl...+ v 关闭当前的VSCode编辑器: ctrl + shift + w 切出一个新的编辑器窗口(最多切出三个): ctrl + \ 切换左中右三个编辑器窗口: ctrl + 1 ctrl...: shift + end 选择从光标到行首的内容: shift + home 删除光标右侧的所有内容(当前行): ctrl + delete 扩展/缩小选区范围: shift + alt + ⬅...(光标切到侧边栏中才有效): ctrl + shirt + e 显示搜索(光标切到侧边栏才有效): ctrl + shirt + f 显示Debug: ctrl + shift + d 显示Output...: ctrl + shift +u 8.修改默认快捷键的方法: 关注公众号:学编程的GISer,后台回复 快捷键 ,获取VSCode官方快捷键汇总PDF。
布局解析 了解完vscode插件的扩展范围,我们再了解一下整个vscode编辑器的布局设计和概念,这样能加深对插件开发的理解。...主侧边栏(Primary Sidebar):主要是展示一个或多个Views,活动栏和主侧边栏紧密耦合,点击活动栏可以打开对应的主侧边栏,该绑定关系通过package.json中的配置进行关联。...辅助边栏(Secondary Sidebar):主要是对主侧边栏的辅助作用,基本与主侧边栏一致 编辑器区域(Editor):我们使用的最多的区域,包含一个或多个编辑器组,可以自定义编辑器或创建Webview...侧边栏工具栏(Sidebar Toolbar):主要用于扩展侧边栏的操作按钮 编辑器工具栏(Editor Toolbar):主要用于扩展编辑器区域的操作按钮 控制面板工具栏(Panel Toolbar...这部分内容基本是我们熟知的开发模式不再过多描述。主要介绍我们应该如何加载静态资源和webview与脚本如果通信。
前言 最近vscode编辑器在前端程序员中使用越来越频繁了,既然大家都在用,说明它一定是香的,身为webstorm党,也得赶紧跟进潮流,这是我这几天学习vscode看过的文章和视频,大家把这些文章和视频看完...内部浏览器打开,免去切换到浏览器的麻烦,安装后在编辑器左侧边栏找到快捷按钮 guides:显示代码对齐辅助线 htmlhint:html标签嵌套错误提示 vscode-icons:文件图标,安装好后点击右下角设置选择文件主题图标...+p:搜索carbon Project Manager:项目管理,安装好后点击左侧边栏最下边文件夹的图标,可以保存打开的项目到favirate,以后可以在这里直接选择自己已经保存好的项目打开 GitLens...+ shift + C 打开当前文字所在路径下的终端 cmd + B 侧边栏显示隐藏 cmd + Shift + G 打开Git可视管理 cmd + Shift + D 打开DeBug面板 cmd +...Cmd + 左右方向键/Fn + 左右方向键 在整行之间移动光标 cmd + X 剪切 cmd + D 删除当前行 cmd + C 复制 /** 生成jsdoc的注释 Alt + up/down 移动上下行
vscode 作为一款逐渐火热的编辑器。它的特点免费、开源、多平台,以及集成git,代码调试,插件丰富等有点,被大家逐渐熟知和认可。 这里主要说一下前端常用插件。...Lorem ipsum 快速填充文本 Npm Intellisense 在import语句中自动完成npm模块引入的代码插件。...历史打开文件之间切换 Ctrl+Tab,Alt+Left,Alt+Right 切出一个新的编辑器(最多3个)Ctrl+\,也可以按住Ctrl鼠标点击Explorer里的文件名 左中右3个编辑器的快捷键...Ctrl+1 Ctrl+2 Ctrl+3 3个编辑器之间循环切换 Ctrl+` 编辑器换位置,Ctrl+k然后按Left或Right 格式调整 代码行缩进Ctrl+[, Ctrl+] 折叠打开代码块...查找替换 查找 Ctrl+F 查找替换 Ctrl+H 整个文件夹中查找 Ctrl+Shift+F 显示相关 全屏:F11 zoomIn/zoomOut:Ctrl + =/Ctrl + - 侧边栏显
VSCode(Visual Studio Code)是由微软研发的一款免费、开源的跨平台(Windows、macOS 以及Linux)文本(代码)编辑器,几乎所有主流的开发语言(C/C++、Java、Python...别的不多说,单凭绿色版这一点,就足够吸引人,而VSCode就是这样一款工具。在三大操作系统上,都可以解压缩后,直接使用,真的很方便。 既然这么好,咱用它来开发Python如何?...5 乾坤大挪移,咱又回到VSCode软件这里。又是左侧边栏第4个大图标,输入:Python,搜索到的第1个就是,点击【安装】按钮。...切换到左侧边栏第1个大图标,选择【打开文件夹】,选择某个磁盘下的文件夹。这一步是为了方便创建、管理文件。 ?...VSCode自动关联了Python配置信息并安装Python 代码分析工具Pylint,它可以分析Python 代码中的错误,查找不符合代码风格标准和有潜在问题的代码。 ?
又见VsCode Visual Studio Code(简称VS Code)是一个由微软开发,同时支持Windows 、Linux 和 macOS 等操作系统的免费代码编辑器,在2019年的Stack...之前写过一篇文章详细介绍如何使用 VsCode 进行远程开发,文章得到了众多读者的广泛好评,传送门:手把手教你配置VS Code远程开发工具,工作效率提升N倍 VsCode 远程开发环境相对其他 IDE...类型填充和联想、符号和函数定义跳转、引用查找等 C/C++ 程序开发和源码管理必备能力,让你的 VsCode 从编辑器进化成 IDE 的基础插件。...这个插件能帮你组织和管理TODO 注释,你在代码中注释的带 TODO 的标签会统一在侧边栏显示出来,当然不限于 TODO 注释,可以自定义管理标签比如 FIXME 等,可以基于标签过滤和筛选。...这个插件完全是因为我太懒想省力,才找的一个辅助工具,我们经常需要通过头文件跳到对应的源文件,或者从源文件跳转到对应的头文件,当然可以在侧边栏的文件管理器中选择打开,但是多了一个步骤有点繁琐,所以我找了这个插件
VSCode 主题设置推荐,自定义配色方案,修改注释高亮颜色 设置主题: 个人比较忠爱vscode的界面,感觉比pycharm要更美观点,虽然两个都装了,但还是会习惯性打开vscode进行调试。...活动栏背景色 1 activityBar.foreground 活动栏前景色(例如用于图标) 12 editor.background 编辑器背景颜色 13 editor.foreground 编辑器默认前景色...匹配括号的背景色 14 editorCursor.foreground 编辑器光标颜色 11 editorGutter.background 编辑器导航线的背景色,导航线包括边缘符号和行号 10 editorLineNumber.foreground...编辑器行号颜色 5 sideBar.background 侧边栏背景色 4 sideBar.foreground 侧边栏前景色 3 sideBarSectionHeader.background 侧边栏节标题的背景颜色...自定义配色方案_weixin_30755393的博客-CSDN博客 具体文件内容我就不贴了,改改颜色和高亮很简单的。
VS Code 定位为一个 高性能轻量级的编辑器,为了保证主进程的稳定,插件系统运行在主进程之外,所有个性化功能都由插件系统完成,在 IDE 和编辑器之间找到一个比较理想的平衡。...上面这张图展示了默认配置情况下 VS Code 的基本界面。 编辑器:在这里码字写代码 侧边栏:可以类比为 macOS 的扩展坞,姑且称为「组件坞」,这里会展示各种组件和插件图标。...组件内容:击侧边栏不同的组件后这里会展示相应显示组件内容。 面板:包括问题显示、输出、调试控制台和终端四个组件。...默认情况下,侧边栏显示的五个组件分别是:资源管理器、跨文件搜索、源代码管理、启动和调试和扩展管理。...随着后期安装插件的增多,侧边栏可以显示的组件数量也会越来越多,不过你可以通过右击侧边栏选择隐藏那些用不到的组件还可以拖动组件图标进行排序。
我之前也是用过很多代码编辑器,从NotePad++、SublimeText一直到PHPStorm,最后VSCode。这个过程每一个编辑器我都折腾了很多配置,插件和主题。...「一」编辑器使用 先讲讲使用编辑器功能的快捷键,这些可以让我们更快捷和顺手的使用VSCode的一些常用功能。同时可以使用这些快捷键挖掘更多编辑器的隐藏功能哦。...快速打开和关闭侧边栏「Opening and Closing the Sidebar」 在我们专注于编程的时候,左边的侧边栏会占用我们一定的宽度,特别是使用双屏(尤其是竖向的屏幕)或者是使用拆分编辑器模式...收起侧边栏可以帮我们节省很多空间。...要有明确的目标,才能知道如何达成目标。在《程序员修炼之道》中提到的“ETC Principle” -- 易于改编原则。这个原则看似简单,但是我们越是深入思考越是觉得“简约而不简单”。
开发者们经常需要连接到远程服务器进行代码编写、调试和部署。Visual Studio Code(VSCode)作为当下最受欢迎的代码编辑器之一,其强大的远程开发功能让这一切变得简单。...本文将详细介绍如何使用 VSCode 远程连接 SSH,实现高效便捷的远程开发。SSH 简介SSH(Secure Shell)是一种网络协议,用于计算机之间的加密登录和其他安全网络服务。...在 macOS 和 Linux 上,SSH 客户端通常已经预装。配置 SSH 密钥:生成 SSH 密钥对,并将公钥添加到远程服务器的 ~/.ssh/authorized_keys 文件中。...连接远程服务器安装好之后左边侧边栏会出现远程连接的图标点击之后在点击加号:在中间搜索栏中输入在弹出的输入框中输入 ssh username@hostname,例如 ssh user@example.com...打开远程项目连接成功后,VSCode 会打开一个新窗口,显示远程服务器的文件系统。您可以像在本地一样浏览、编辑和保存文件。4.
新建文件: Ctrl+N 文件之间切换: Ctrl+Tab 打开一个新的VS Code编辑器: Ctrl+Shift+N 关闭当前窗口: Ctrl+W 关闭当前的VS Code...编辑器: Ctrl+Shift+W 切出一个新的编辑器窗口(最多3个): Ctrl+\ 切换左中右3个编辑器窗口的快捷键: Ctrl+1 Ctrl+2 Ctrl+3 2、代码编辑 (...: Shift+End 选择从光标到行首的内容: Shift+Home 删除光标右侧的所有内容(当前行): Ctrl+Delete 扩展/缩小选取范围: Shift+Alt+Right 和...): Ctrl +/- 侧边栏显示或隐藏: Ctrl+B 显示资源管理器(光标切到侧边栏中才有效): Ctrl+Shift+E 显示搜索(光标切到侧边栏中才有效): Ctrl+Shift...+F 显示(光标切到侧边栏中才有效): Git Ctrl+Shift+G 显示 Debug: Ctrl+Shift+D 显示 Output: Ctrl+Shift+U (6) 其他设置
: Clear 删除当前文件中的所有书签 Bookmarks: Clear from All Files 删除当前项目下的所有书签 我们还可以通过打开侧边栏中的书签tab查看所有标签: 括号对彩色化 插件名...这个时候对方只需要点击侧边栏的Live Share图标,然后在会话详细信息中找到并且点击加入协作会话...。 点击后编辑器上方会出现一个输入框,对方只需要输入我们提供的邀请连接然后按回车即可。...高亮匹对标签 插件名:VSCode Highlight Matching Tag 此插件高亮显示匹对开始和/或结束标签。还可以在状态栏中显示标签的路径。...Java依赖查看器 查看Java项目、引用库、资源文件、包、类和类成员 Visual Studio IntelliCode 开发辅助 完整的代码填充 其他语言支持 使用VSCode开发其他语言也是完全可以的...,只要在插件搜索栏输入我们想用的语言,就可以找到那个语言的相关插件和支持。
前言 介绍一下我在VSCode中常用的一些快捷方式: ctrl+上下箭头 上下滚动页面 Ctrl+Shift+K 删除某一行 Alt+ ↑ / ↓ 移动某一行 Shift+Alt + ↓ / ↑ 复制某一行...打开一个新窗口:Ctrl+Shift+N 关闭窗口:Ctrl+Shift+W 同时打开多个编辑器(查看多个文件) 新建文件:Ctrl+N 文件之间切换:Ctrl+Tab 切出一个新的编辑器(最多 3...个,分屏) Ctrl+,也可以按住 Ctrl 鼠标点击 Explorer 里的文件名 左中右 3 个编辑器的快捷键:Ctrl+1 Ctrl+2 Ctrl+3 3 个编辑器之间循环切换:Ctrl+ 编辑器换位置...file_name_you_chose 2.3 查找替换 查找 Ctrl+F 查找替换 Ctrl+H 整个文件夹中查找 Ctrl+Shift+F 2.4 显示相关 全屏:F11 zoomIn/zoomOut:Ctrl +/- 侧边栏显...前端开发常用插件 1)View In Browser 预览页面(ctrl+F1) 2)vscode-icons 侧栏的图标,对于一个有视觉强迫症的人是必须要的 3)HTML Snippets
俗话说得好,工欲善其事必先利其器,要想工作效率高,码代码的工具用的好是必须的,这里主要说一下 Mac 上 VScode 的快捷键,帮助大家快速搭建良好的开发工具。...Code Runner - 运行选中代码段(支持大量语言,包括 Node) Git Blame - 在状态栏显示当前行的 Git 信息 Git History - 查看 git log GitLens...和编辑器的设置,不喜欢的可以自行 google 或者 百度。...编辑器与窗口管理 打开一个新窗口:Cmd+Shift+N,新打开一个项目时会用到 关闭窗口:Cmd+Shift+W 关闭标签页:Cmd+W 新建文件 Cmd+N 文件之间切换 Cmd+~ 切出一个新的编辑界面...B,也就是侧边栏 切换同一编辑器不同的标签页:control+tab 代码编辑 格式调整 格式化代码:shift+Option+F 上下移动一行:Option+Up 或 option+Down 向上向下复制一行
类型填充和联想、符号和函数定义跳转、引用查找等 C/C++ 程序开发和源码管理必备能力,让你的 VsCode 从编辑器进化成 IDE 的基础插件。...这个插件能帮你组织和管理TODO 注释,你在代码中注释的带 TODO 的标签会统一在侧边栏显示出来,当然不限于 TODO 注释,可以自定义管理标签比如 FIXME 等,可以基于标签过滤和筛选。...能帮你方便的创建和管理书签,看到哪个位置想加个书签就按快捷键 Ctrl + Alt + K ,多按一次就是删除,不仅如此他还提供了在书签之前跳跃和查看管理的功能,更多功能可以自己体验,反正我看大工程源码用这个很爽...这个插件完全是因为我太懒想省力,才找的一个辅助工具,我们经常需要通过头文件跳到对应的源文件,或者从源文件跳转到对应的头文件,当然可以在侧边栏的文件管理器中选择打开,但是多了一个步骤有点繁琐,所以我找了这个插件...,其实按插件的说明文档,它是能在不同的文件类型之间跳转,不仅仅局限于头文件和源文件,懒人福音,你值得拥有。
今天他来了 ---VSCode VSCode也是一种编辑器适用于大项目,选择他的主要原因是VSCode可以ssh远程连接到服务器上,这个特性使得我们在服务器上开发变得非常轻松,只要连接上后,就与本地开发无异...接下来看看如何利用VSCode远程服务器 1.首先下载安装 remote-ssh扩展 2.安装后侧边会有一个电脑图标,点击他,在点击+号新键一个连接 3.在命令面板输入 ssh 服务器登录用户名@服务器...ip -A后回车 4.选择一个配置文件,配置连接服务器相关 5.键入如下配置 Host 表示连接名称随便取 6.保存配置后侧边显示连接名称,点击右边图标开始连接 7.选择服务器平台 这里是...linux 8.点击后,等会一会可能会提醒你输入密码,也就是远程服务器的密码,我这里已经连接过一次了 状态栏出现如下连接成功 9.接下来我们可以打开项目文件夹进行开发了,在命令面板键入路径即可...10.编码同步 到此VSCode远程服务器就介绍到这里了
主命令框 最重要的功能就是F1或Ctrl+Shift+P打开的命令面板了,在这个命令框里可以执行VSCode的任何一条命令,甚至关闭这个编辑器。...同时打开多个窗口(查看多个项目) 打开一个新窗口: Ctrl+Shift+N 关闭窗口: Ctrl+Shift+W 同时打开多个编辑器(查看多个文件) 新建文件 Ctrl+N 文件之间切换 Ctrl...+Tab 切出一个新的编辑器(最多3个)Ctrl+\,也可以按住Ctrl鼠标点击Explorer里的文件名 左中右3个编辑器的快捷键Ctrl+1 Ctrl+2 Ctrl+3 3个编辑器之间循环切换...e.g., example.[0-9] to match on example.0,example.1, … 显示相关 全屏:F11 zoomIn/zoomOut:Ctrl + =/Ctrl + - 侧边栏显.../隐:Ctrl+B 侧边栏4大功能显示: Show Explorer Ctrl+Shift+E Show SearchCtrl+Shift+F Show GitCtrl+Shift+G Show
集成到编辑器中:ShellCheck 可以集成到各种文本编辑器和IDE中,如Vim、Emacs、Sublime、Atom和VSCode等,实现实时反馈和快速修复。...其它 集成到编辑器中的使用示例(以VSCode为例),如果你使用的是VSCode编辑器,并希望将ShellCheck集成到其中以实现实时反馈,你可以按照以下步骤操作: 在VSCode中打开Extensions...视图(通过点击左侧边栏上的方块图标或按Ctrl+Shift+X)。...安装完成后,重新加载VSCode或重启编辑器。 打开你的Shell脚本文件。VSCode现在应该在后台使用ShellCheck来分析你的脚本,并在发现问题时显示警告或错误。...这些警告和错误通常会在代码编辑器的左侧边栏中通过波浪线或图标标记出来,你可以点击它们来查看更多详细信息或修复建议。
领取专属 10元无门槛券
手把手带您无忧上云