vscode VIM设置

自动格式化

vim JK操作tab 代替gt GT 快捷键

{
  "window.zoomLevel": 0,
  "git.path": "/user/bin/git",
  "files.exclude": {
    "**node_modules**": true
  },
  "editor.formatOnSave": true,
  "files.autoSave": "afterDelay",
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  // gt gT生效
  "vim.normalModeKeyBindingsNonRecursive": [
    {
      "before": [
        "K"
      ],
      "after": [
        "g",
        "t"
      ]
    },
    {
      "before": [
        "J"
      ],
      "after": [
        "g",
        "T"
      ]
    }
  ]
}

新建snippet tsx中无法使用

解决方案：

Try using the javascriptreact and typescriptreact scopes for jsx and tsx respectively. These are treated as separate languages for legacy reasons

"scope": "javascript,typescript,reacttypescript,javascriptreact,typescriptreact",

vim hjkl按住无法连续移动光标？

解决方案

defaults write com.microsoft.VSCode ApplePressAndHoldEnabled -bool false         # For VS Code
defaults write com.microsoft.VSCodeInsiders ApplePressAndHoldEnabled -bool false # For VS Code Insider
defaults delete -g ApplePressAndHoldEnabled

执行以上代码后，重启vscode

mac个人快捷键

code - preferences - keyborad short cuts

// Place your key bindings in this file to override the defaultsauto[]
[
  {
    "key": "cmd+backspace",
    "command": "workbench.action.terminal.kill"
  },
  {
    "key": "ctrl+g",
    "command": "editor.action.revealDefinition",
    "when": "editorHasDefinitionProvider && editorTextFocus && !isInEmbeddedEditor"
  },
  {
    "key": "f12",
    "command": "-editor.action.revealDefinition",
    "when": "editorHasDefinitionProvider && editorTextFocus && !isInEmbeddedEditor"
  },
  {
    "key": "cmd+1",
    "command": "-workbench.action.focusFirstEditorGroup"
  },
  {
    "key": "cmd+1",
    "command": "workbench.action.openEditorAtIndex1"
  },
  {
    "key": "ctrl+1",
    "command": "-workbench.action.openEditorAtIndex1"
  },
  {
    "key": "cmd+2",
    "command": "workbench.action.openEditorAtIndex2"
  },
  {
    "key": "ctrl+2",
    "command": "-workbench.action.openEditorAtIndex2"
  },
  {
    "key": "cmd+3",
    "command": "workbench.action.openEditorAtIndex3"
  },
  {
    "key": "ctrl+3",
    "command": "-workbench.action.openEditorAtIndex3"
  },
  {
    "key": "cmd+4",
    "command": "workbench.action.openEditorAtIndex4"
  },
  {
    "key": "ctrl+4",
    "command": "-workbench.action.openEditorAtIndex4"
  },
  {
    "key": "cmd+5",
    "command": "workbench.action.openEditorAtIndex5"
  },
  {
    "key": "ctrl+5",
    "command": "-workbench.action.openEditorAtIndex5"
  },
  {
    "key": "cmd+6",
    "command": "workbench.action.openEditorAtIndex6"
  },
  {
    "key": "ctrl+6",
    "command": "-workbench.action.openEditorAtIndex6"
  },
  {
    "key": "cmd+7",
    "command": "workbench.action.openEditorAtIndex7"
  },
  {
    "key": "ctrl+7",
    "command": "-workbench.action.openEditorAtIndex7"
  },
  {
    "key": "r",
    "command": "renameFile",
    "when": "explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus"
  },
  {
    "key": "enter",
    "command": "-renameFile",
    "when": "explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && !inputFocus"
  }
]

MacOS下问题解决

vscode tab切换中文输入法问题

github.com/daipeihust/…

在setting.json下添加 "vim.autoSwitchInputMethod.enable": true, "vim.autoSwitchInputMethod.defaultIM": "com.apple.keylayout.US", "vim.autoSwitchInputMethod.obtainIMCmd": "/usr/local/bin/im-select", "vim.autoSwitchInputMethod.switchIMCmd": "/usr/local/bin/im-select {im}"

macos im-select 下载安装失败

curl -Ls raw.githubusercontent.com/daipeihust/… | sh 执行后，无任何效果

解决方案

先查看 raw.githubusercontent.com/daipeihust/…

#!/bin/sh

# if im-select already exist, delete it and download it again
if [ -e /usr/local/bin/im-select ]
then
    rm -f /usr/local/bin/im-select
fi

echo "* Downloading im-select..."

curl -Ls -o /usr/local/bin/im-select https://github.com/daipeihust/im-select/raw/master/im-select-mac/out/im-select

chmod 777 /usr/local/bin/im-select

echo "* im-select is installed!"
echo "*"
echo "*"
echo "*"
echo "* now run \"im-select\" in your terminal!"

知道其是下载了 github.com/daipeihust/… 的链接；

1. 访问以上的连接
2. 下载完成后执行以下命令

sudo mv /Users/$USER/Downloads/im-select /usr/local/bin/
sudo chmod 777  /usr/local/bin/im-select

MacOS 支持 code . 命令

安装code：

打开VSCode –> command+shift+p –> 输入shell command –> 点击提示Shell Command: Install ‘code’ command in PATH运行

使用：

打开终端，cd到要用VSCode打开的文件夹，然后输入命令code .即可打开

Mac 两个vscode窗口快速切换

mac的所有app切换窗口都是: cmd+`

切换应用: cmd+tab

好用的 vscode 插件

成本提示 import cost

Import Cost 这个扩展简直惊艳到我了，之前写代码的时候很少有关注导入包的大小。只有在后期优化的时候才考虑这些问题。但是这个插件可以在你导入包的时候就提示这个包有多大。

效果：

Quokka.js

支持nodejs场景的js、ts调试；使用十分方便；

实际使用：

GitLens

VS Code中的 Git 体验在易用性和完整性之间取得了一个不错的平衡，大部分用户都能够使用它完成工作，同时又不会被太多的功能吓到。但是很多硬核的 Git 用户肯定会觉得功能还不够用。包括但不限于：

不能查看某个 commit 中的代码改动； 不能比较两个 commit 或者 branch，然后阅览代码改动； 不能查看代码历史记录。 不过 GitLens 这个插件的出现，就弥补上了上述不足。

node_modules包搜索工具

Search node_modules

marketplace.visualstudio.com/items?itemN…