Mac下 VSCode快捷键 VSCode基本使用

由于Sublime Text 安装插件的问题实在是无奈,最后向VSCode低头,决定转战VSCode,虽然可以设置成Sublime Text 快捷键,但多少还是有些不适应,只能从头继续学习了。

Mac 快捷键指示:

  • ⌘ :Command键
  • ⌥ :Option/Alt
  • ⇧ :Shift按键
  • ^ : 表示的是Control键

Mac VSCode 快捷键

全局

Command + Shift + P 显示命令面板
Command + P 快速打开
Command + Shift + N 打开新窗口
Command + W 关闭窗口
Command + , 打开用户设置
Command + K Command + S 显示快捷方式

基本

Command + X 剪切(未选中文本的情况下,剪切光标所在行)
Command + C 复制(未选中文本的情况下,复制光标所在行)
Option + ↑ 向上移动行
Option + ↓ 向下移动行
Option + Shift + ↑ 向上复制行
Option + Shift + ↓ 向下复制行
Command + Shift + K 删除行
Command + Enter 下一行插入
Command + Shift + Enter 上一行插入
Command + Shift + 跳转到匹配的括号
Command + [ 减少缩进
Command + ] 增加缩进
Command + Shift + [ 切换到上一个已打开文件标签
Command + Shift + ] 切换到下一个已打开文件标签
Control + - 切换到上一个已打开文件标签
Control + Shift + - 切换到下一个已打开文件标签
Command + K Command + 0 折叠全部代码块(这个是数字,不是字母。0是代码折叠级别,同理可以换用1,2,3等)
Command + K Command + J 展开全部代码块
Command + K Command + C 添加行注释
Command + / 添加、移除行注释
Option + Shift + A 添加、移除块注释
Command + Shift + D 复制光标所在整行,插入在该行之前
Command + K U 选中单词改为大写
Command + K L 选中单词改为小写
Command + Option + [ 代码折叠
Command + Option + ] 代码展开

多光标与选择

Command + ↑ 跳转至文件开头
Command + ↓ 跳转至文件结尾
Command + 点击 插入多个光标
Option + 左键按住不放,拖动鼠标 添加多个光标
Command + U 撤销上一个光标操作
Option + Shift + I 在所选行的行尾插入光标
Control + Shift +↑ 向上面一行添加游标
Control + Shift + ↓ 向下面一行添加游标
Command + J 删除当前行与下一行内容合并成一行(光标未选中多行内容的时候) 或 将多行内容合并成一行(已选择需要合并的多行时)
Option + Shift +↑ 向上复制一行
Option + Shift + ↓ 向下复制一行
Option + → 以单词为单位向后移动光标
Option + Shift + → 以单词为单位向后选中文本
Command + K R 在资源管理器中显示活动文件

查找替换

Command + F 查找
Command + Option + F 替换
Command + Shift + F 在当前文件中查找查找
Command + Shift + H 在文件夹中查找替换
Command + G 查找下一个
Command + Shift + G 查找上一个
Option + Enter 选中所有匹配项
Command + D 向下选中相同内容
Command + K Command + D 移除前一个向下选中相同内容

进阶

Option + Shift + F 格式化代码
Command + L 选中当前行SHIFT + ALT + F 格式化代码
Command + K Command + F 格式化选择部分
Command + K Command + X 删除行尾多余空格
Command + kk Control + kk 删除光标至当前行尾内容

导航

Control + R 跳转到当前文件的某一符号位置
Control + G 跳转至某行
Command + P 跳转到某个文件
Command + M 光标移动至括号内开始或结束的位置
Command + Shift + O 跳转到某个符号
Command + Shift + M 打开问题面板

编辑器管理

Command + W 关闭编辑器
Command + 编辑器分屏
Command + 1 切换到第一分组
Command + 2 切换到第二分组
Command + 3 切换到第三分组
Command + K Left 激活左侧编辑组
Command + K Right 激活右侧编辑组
Command + K Z 切换禅模式

文件管理

Command + N 新建文件
Command + O 打开文件
Command + S 保存文件
Command + Shift + S 另存为
Command + Option + S 全部保存
Command + W 关闭
Command + K Command + W 全部关闭
Command + Shift + T 重新打开被关闭的编辑器
Control + Tab 打开下一个
Control + Shift + Tab 打开上一个
Command + K R 在资源管理器中查看当前文件
Command + K O 新窗口打开当前文件

调试

Command + Shift + D 调试
Command + Shift + X 安装插件

显示

Command + Ctrl + F 全屏、退出全屏
Command + + 放大
Command + - 缩小
Command + B 显示、隐藏侧边栏
Command + Shift + F 显示搜索框
Command + Shift + X 显示插件面板
Command + Shift + H 全局搜索替换
Command + Shift + J 显示、隐藏高级搜索
Command + Shift + U 显示、隐藏输出面板

集成终端

Control + 显示终端 Control + Shift + 新建终端
Command + Shift + U 输出
Command + Shift + Y 调试控制台

正则替换

目标
将类似 <div id="aaaa">1</div>这样的语句替换成<div id="aaa" calss="jiaoshou">1</div>
替换方法
调出查找和替换界面
点下最左侧的.*按钮,启用正则搜索
Find What界面中输入<div id="aaaa">(.*)</div>,别忘了这儿的小括号
Replace With中输入 <div id="aaaa" class="jiaoshou">$1</div>这儿的$1就代表了第一个括号中匹配的内容
Replace ALL!
替换前:

<div id="aaaa">较瘦f2e</div>
<div id="aaaa">前端</div>
<div id="aaaa">较瘦</div>

替换后:

<div id="aaaa" class="jiaoshou">较瘦f2e</div>
<div id="aaaa" class="jiaoshou">前端</div>
<div id="aaaa" class="jiaoshou">较瘦</div>

稍微再加点限制:

<div id="aaaa">较瘦f2e</div>
<span id="bbbb">前端</span>
<a id="cccc">较瘦</a>

Find What界面中输入 <(.*) id=(.*)>(.*)</(.*)>
Replace With中输入 <$1 id=$2 class="jiaoshou">$3</$4>
替换后:

<div id="aaaa" class="jiaoshou">较瘦f2e</div>
<span id="bbbb" class="jiaoshou">前端</span>
<a id="cccc" class="jiaoshou">较瘦</a>

element

使用E[attr]添加属性:
带有某个属性的标签( a[title=abc])
eg:

<a href="" title="abc"></a>

使用E{text}添加文本:

带有标签内容(p{内容})

eg:

<p>内容</p>

使用E$*N创建多个标签
带序号的元素(p.abc$*5)

eg:

<p class="abc1"></p>
<p class="abc2"></p>
<p class="abc3"></p>
<p class="abc4"></p>
<p class="abc5"></p>

settings.json

{
    //主题设置
    "workbench.colorTheme": "Monokai",
    // 默认编辑器字号
    "editor.fontSize": 14,
    //是否自动换行 
    "editor.wordWrap": "on",
    // tab几个缩进
    "editor.tabSize": 2,
    // 文件自动保存
    "files.autoSave": "afterDelay",
    // 自动格式化粘贴的代码
    "editor.formatOnPaste": true,
    // 在资源管理器删除内容时候是否进行用户提醒
    "explorer.confirmDelete": false,
    // 控制在资源管理器内拖放移动文件或文件夹时是否进行确认
    "explorer.confirmDragAndDrop": false,
    // 在资源管理器拖拽文件是否进行用户提醒
    "workbench.statusBar.visible": true,
    // 工作区缩放级别
    "window.zoomLevel": 0,
    // 重命名或移动文件时,启用或禁用自动更新导入路径
    "javascript.updateImportsOnFileMove.enabled": "always",
    // 启用/禁用导航路径
    "breadcrumbs.enabled": true,
    // 终端cmd字号
    "terminal.integrated.fontSize": 16,
    // 不检查缩进,保存后统一按设置项来设置
    "editor.detectIndentation": false,
    // 编辑器初始界面
    "workbench.startupEditor": "newUntitledFile",
    // 工作台状态栏是否可见
    "workbench.statusBar.feedback.visible":false,
    // 添加多个光标时候需要的快捷键
    "editor.multiCursorModifier": "ctrlCmd",
    // 自定义代码片段显示的位置
    "editor.snippetSuggestions": "top",
    "window.menuBarVisibility": "toggle",
    // 启用后,按下 TAB 键,将展开 Emmet 缩写。
    "emmet.triggerExpansionOnTab": true,
    // 控制编辑器在空白字符上显示符号的方式
    "editor.renderWhitespace": "all",
    // 控制编辑器是否应呈现空白字符
    "editor.renderControlCharacters": false,
    // 在文件和文件夹上显示错误和警告
    "problems.decorations.enabled": false,
    // html文件格式化程序
    "[html]": {
        "editor.defaultFormatter": "vscode.html-language-features",
        "editor.codeActionsOnSave": {
          // 禁止eslint对html进行校验
          "source.fixAll.eslint": false,
          // 禁止stylelint对html进行校验
          "source.fixAll.stylelint": false
        }
    },
    // 编辑器文件保存时的操作(MacOS:快捷键是 command + s ),并不能修复所有问题,多数还是需要手动修复
    // 
    "editor.codeActionsOnSave": {
      // 文件保存时开启eslint自动修复程序
      "source.fixAll.eslint": true,
      // 文件保存时开启stylelint自动修复程序
      "source.fixAll.stylelint": true
    },
    // "[javascript]": {
    //     "editor.defaultFormatter": "vscode.typescript-language-features"
    // },

    // vscode-fileheader  -----settings begin-----

    // 文件作者
    "fileheader.Author": "JiaoShouf2e",
    // 文件最后修改者
    "fileheader.LastModifiedBy": "JiaoShouf2e",
    
    // vscode-fileheader  -----settings end-----

    
    //stylelint   -----settings begin-----
    
    // 防止编辑器内置linter与插件冲突设置
    "css.validate": false,
    "less.validate": false,
    "scss.validate": false,
    // 启用stylelint插件
    "stylelint.enable": true,

    //stylelint   -----settings end-----

    // eslint   -----settings begin-----

    // 是否为JavaScript文件开启eslint检测
    "eslint.enable": true,
    // 保存之后进行lint
    "eslint.run": "onSave",
    // 是否启用eslint的调试模式
    "eslint.debug": true
    // eslint   -----settings end-----
    
}

原文地址:https://www.cnblogs.com/jiaoshou/p/13064962.html