重新定义代码编辑——是时候从phpstorm转向VSCode了

1,171 阅读3分钟

想要更好的阅读体验,请观看原文出处:www.pilishen.com/posts/maybe…

点击链接加入我们的php&laravel公开课交流群

同时本文内容,均有配套的免费视频演示与讲解:《重新定义代码编辑--VSCode IDE工作流程介绍》

课程章节截图

VSCode拥有sublime的性能,同时拥有Phpstorm的功能(实际不止),而且还完全免费

下载链接:https://code.visualstudio.com/

有了如此的承诺,我很难想象你不会放下sublime或者Phpstorm,从而转向VSCode的阵营,下图是国外某社区关于phpstorm和vscode的关注度对比图:

file

事实上,现在的vscode并非是我们老印象里所谓的“微软的垃圾产品”,新版的vcode其实是由原来大名鼎鼎的eclipse团队重新开发的,希望重新定义的vcode重新定义我们的代码编辑流程~

常用快捷键:

(使用演示及快捷键的自定义请看该文章的配套视频课程:《重新定义代码编辑--VSCode IDE工作流程介绍》

  • CMD + P: 文件的快速跳转
  • CMD + D: 选中鼠标所在词汇,多次按下后可选择其他行内的当前词汇
  • Alt + Shift + arrow up/down: 向上或者向下复制一行,这个我自定义成了ctrl + shift + D
  • CMD + Shift + K: 删除当前一行,这个我改成了ctrl + Y
  • Option + arrow up/down: 将当前行向上或者向下移动一行
  • CMD + B: 控制左侧栏的显示与隐藏,这个我改成了alt + 1
  • pubf: 快速创建一个function(method)
  • 往前或往后跳到上一次的编辑位置

file

流行插件(扩展)列表:

(插件安装、介绍及使用演示请看该文章的配套视频课程:《重新定义代码编辑--VSCode IDE工作流程介绍》

(一)PHP及laravel相关的插件

(二)Vue及JS相关的插件

  • Vue 2 Snippets
  • Vetur
  • npm: 提供更好的npm支持
  • npm Intellisense: 引入npm组件的时候,能提供自动提示和补齐(autocomplete)的功能
  • Import Cost:当你import或者require某一个组件的时候,能直接显示该组件的引入大小

(三)主题与美化相关的插件

(四)HTML&CSS等相关的插件

(五)其他辅助功能相关的插件