vue

  • 【vetur】 vue语法高亮
  • 【vueHelper】vue2代码段



vscode less插件不能生成css_vscode多个光标


react

  • 【react playground】react运行环境
  • 【react standard style code snippets】react standard风格代码块


vscode less插件不能生成css_vscode怎么引用css_02


HTML

  • 【auto close tag】 自动闭合HTML标签
  • 【auto rename tag】 修改HTML标签时自动修改匹配标签
  • 【htmltagwrap】包裹HTML
  • 【HTML css suppot】css提示,支持vue的css提示

css

  • 【beautify css/sass/scss/less】 css/sass/scss/less格式化
  • 【color highlight】颜色值在代码中高亮显示
  • 【less intellisense】less变量与混合提示
  • 【postCss sorting】css排序
  • 【sass】sass插件
  • 【language-stylus】stylus语法高亮和提示

js

  • 【json tools】格式化和压缩json

ts

  • 【TSLint】typescript语法检查
  • 【Typescript import】ts自动import

注释

  • 【better comments】编写更加人性化的注释
  • 【document this】注释文档生成

语法检查

  • 【eslint】 eslint插件高亮提示
  • 【stylelint】css/sass/less代码风格

VS code编译器设置

  • 【VS code icon】 文件图片标识
  • 【vscode-random】随机字符串生成器
  • 【styled-components】VS coed-component高亮支持
  • 【VS coed-styled-jsx】styled-jsx高亮支持

git

  • 【git blame】在状态栏显示当前行的git信息
  • 【git history】查看git log
  • 【gitLens】显示文件最近的commit和作者,显示当前行commit信息
  • 【gitignore】.gitignore文件语法

其他

  • 【bookmarks】添加行书签
  • 【code spell checker】单词拼写检查
  • 【file peek】根据路径字符串,快速定位到文件
  • 【font-awesome codes for html】fontawesome提示代码段
  • 【guides】高亮缩进基准线
  • 【path autocomplete】完整路径提示
  • 【project manager】切换项目
  • 【REST client】发送REST风格的HTTP请求
  • 【sort lines】 排序选中行string manipulation
  • 【test spec generator】测试用例生成
  • 【version lens】package.json文件显示模块当前版本和最新版本
  • 【view node package】快速打开选中模块主页和代码仓库
  • 【filesize】状态栏显示当前文件大小
  • 【markdownlint】markdown格式提示
  • 【npm intellisense】导入模块提示已安装模块名称npm

编辑器与窗口管理


vscode less插件不能生成css_sublime less插件安装_03


  • 打开一个新窗口: Ctrl+Shift+N
  • 关闭窗口: Ctrl+Shift+W
  • 同时打开多个编辑器(查看多个文件)
  • 新建文件 Ctrl+N
  • 文件之间切换 Ctrl+Tab
  • 切出一个新的编辑器(最多 3 个) Ctrl+,也可以按住 Ctrl 鼠标点击 Explorer 里的文件名
  • 左中右 3 个编辑器的快捷键 Ctrl+1 Ctrl+2 Ctrl+3
  • 3 个编辑器之间循环切换 Ctrl+
  • 编辑器换位置, Ctrl+k然后按 Left或 Right

格式调整

  • 代码行缩进: Ctrl+[ 、 Ctrl+]
  • Ctrl+C 、 Ctrl+V 复制或剪切当前行/当前选中内容
  • 代码格式化: Shift+Alt+F,或 Ctrl+Shift+P 后输入 format code
  • 上下移动一行: Alt+Up 或 Alt+Down
  • 向上向下复制一行: Shift+Alt+Up 或 Shift+Alt+Down
  • 在当前行下边插入一行: Ctrl+Enter
  • 在当前行上方插入一行 Ctrl+Shift+Enter

光标相关

  • 移动到行首: Home
  • 移动到行尾: End
  • 移动到文件结尾: Ctrl+End
  • 移动到文件开头: Ctrl+Home
  • 移动到定义处: F12
  • 定义处缩略图:只看一眼而不跳转过去 Alt+F12
  • 移动到后半个括号: Ctrl+Shift+]
  • 选择从光标到行尾: Shift+End
  • 选择从行首到光标处: Shift+Home
  • 删除光标右侧的所有字: Ctrl+Delete
  • 扩展/缩小选取范围: Shift+Alt+Left 和 Shift+Alt+Right
  • 多行编辑(列编辑):Alt+Shift+鼠标左键, Ctrl+Alt+Down/Up
  • 同时选中所有匹配: Ctrl+Shift+L
  • Ctrl+D 下一个匹配的也被选中 (在 sublime 中是删除当前行,后面自定义快键键中,设置与 Ctrl+Shift+K互换了)
  • 回退上一个光标操作: Ctrl+U
  • 选中所有匹配词批量编辑:鼠标高亮选中需要查找的词,按下 Ctrl + Shift + L,即可快速选中当前文件中所有匹- 配的词,并在每一个词后面有一个编辑光标,可批量同步编辑

选择语言模式:ctrl+k, m

列操作(multiCursor):

  • Alt+鼠标左键点击:添加多光标输入
  • Alt+鼠标左键拖动:选择各行的部分内容
  • Shift+Alt+鼠标左键点击:垂直选中列
  • Shift+Alt+鼠标左键拖动:选中拖动的区域内容

重构代码

  • 找到所有的引用: Shift+F12
  • 同时修改本文件中所有匹配的: Ctrl+F12
  • 重命名:比如要修改一个方法名,可以选中后按 F2,输入新名字,回车,则所有该方法的引用也都同步更新了
  • 跳转到下一个 Error 或 Warning:当有多个错误时可以按 F8 逐个跳转
  • 查看 diff: 在 explorer 里选择文件右键 Set file tocompare,然后需要对比的文件上右键选择 Compare with file_name_you_chose

查找替换

  • 查找 Ctrl+F
  • 查找替换 Ctrl+H
  • 整个文件夹中查找 Ctrl+Shift+F

显示相关

  • 全屏:F11
  • ZoomIn/zoomOut:Ctrl +/-
  • 侧边栏显/隐: Ctrl+B
  • 显示资源管理器 Ctrl+Shift+E
  • 显示搜索 Ctrl+Shift+F
  • 显示 Git Ctrl+Shift+G
  • 显示 Debug Ctrl+Shift+D
  • 显示 Output Ctrl+Shift+U

其他

  • 自动保存:File -> AutoSave,或者 Ctrl+Shift+P,输入 auto

修改默认快捷键

打开默认键盘快捷方式设置:File -> Preferences -> Keyboard Shortcuts,或者:Alt+F -> p -> k