WebStorm 是 jetbrains 公司旗下一款 JavaScript 开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaSscript IDE”等。与 IntelliJ IDEA 同源，继承了 IntelliJ IDEA 强大的JS部分的功能。现将最常用的快捷键挑出来备忘，既能方便记忆，又能提高工作效率。

快捷键 说明
ctrl+shift+N 通过文件名快速查找工程内的文件(必记)
ctrl+shift+alt+N 通过一个字符快速查找位置(必记)
ctrl+F 在文件内快速查找代码
F3 查找下一个
shift+F3 查找上一个
ctrl+R 文件内代码替换
　ctrl+shift+R 指定目录内代码批量替换
　ctrl+shift+F 指定目录内代码批量查找
　ctrl+R 文件内代码替换
　ctrl+shift+A 快速查找并使用编辑器所有功能(必记)
　alt+[0-9] 快速拆合功能界面模块
ctrl+shift+F12 最大区域显示代码(会隐藏其他的功能界面模块)
　alt+shift+F 将当前文件加入收藏夹
　ctrl+alt+s 打开配置窗口
　ctrl+tab 切换代码选项卡(还要进行此选择，效率差些)
　alt+<-或-> 切换代码选项卡
  • 界面操作
快捷键 说明
　　ctrl+shift+N 　通过文件名快速查找工程内的文件(必记)
　　ctrl+shift+alt+N 　通过一个字符快速查找位置(必记)
　　ctrl+F 　在文件内快速查找代码
　　F3 　查找下一个
　　shift+F3 　查找上一个
　　ctrl+R 　文件内代码替换
　　ctrl+shift+R 　指定目录内代码批量替换
　　ctrl+shift+F 　指定目录内代码批量查找
　　ctrl+R 　文件内代码替换
  • 代码编辑
快捷键 说明
　　ctrl+shift+A 快速查找并使用编辑器所有功能(必记)
　　alt+[0-9] 　快速拆合功能界面模块
　　ctrl+shift+F12 　最大区域显示代码(会隐藏其他的功能界面模块)
　　alt+shift+F 　将当前文件加入收藏夹
　　ctrl+alt+s 　打开配置窗口
　　ctrl+tab 　切换代码选项卡(还要进行此选择，效率差些)
　　alt+<-或-> 　切换代码选项卡
　　ctrl+F4 　关闭当前代码选项卡
  • 导航
快捷键 说明
　　ctrl+D 复制当前行
　　ctrl+W 选中单词
　　ctrl+<-或-> 以单词作为边界跳光标位置
　　alt+Insert 新建一个文件或其他
　　ctrl+alt+L 格式化代码
　　shift+tab /tab减少/扩大缩进(可以在代码中减少行缩进)
　　ctrl+Y 删除一行
　　shift+enter 重新开始一行(无论光标在哪个位置)
  • 建议配置版本控制快捷键
快捷键 说明
　　esc 进入代码编辑区域
　　alt+F1 查找代码在其他界面模块的位置，颇为有用
　　ctrl+G 到指定行的代码
　　ctrl+]/[ 光标到代码块的前面或后面
　　alt+up/down 上一个/下一个方法
　　ctrl+C 提交代码
　　ctrl+p 向远程版本库推送更新
　　ctrl+G 到指定行的代码
　　ctrl+]/[ 光标到代码块的前面或后面
　　alt+up/down 上一个/下一个方法

下面是Webstorm的一些常用快捷键：

快捷键 说明
ctrl + shift + n 打开工程中的文件，目的是打开当前工程下任意目录的文件。
ctrl + j 输出模板
ctrl + b 跳到变量申明处
ctrl + alt + T 围绕包裹代码(包括zencoding的Wrap with Abbreviation)
ctrl + [] 匹配 {}[]
ctrl + F12 可以显示当前文件的结构
ctrl + x 剪切(删除)行，不选中，直接剪切整个行，如果选中部分内容则剪切选中的内容
alt + left/right 标签切换
ctrl + r 替换
ctrl + shift + up 行移动
shift + alt + up 块移动(if(){},while(){}语句块的移动)
ctrl + d 行复制
ctrl + shift + ]/[ 选中块代码
ctrl + / 单行注释
ctrl + shift + / 块注释
ctrl + shift + i 显示当前CSS选择器或者JS函数的详细信息
ctrl + '-/+' 可以折叠项目中的任何代码块，它不是选中折叠，而是自动识别折叠。
ctrl + '.' 折叠选中的代码的代码。
ctrl+shift+/ 块注释
ctrl+shift+ +/- 展开/折叠
ctrl+alt+L 格式化代码
ctrl+shift+ up/down 上下移动句子
Alt+回车 导入包,自动修正
Ctrl+N 查找类
Ctrl+Shift+N 查找文件
Ctrl+Alt+L 格式化代码
Ctrl+Alt+O 优化导入的类和包
Alt+Insert 生成代码(如get,set方法,构造函数等)
Ctrl+E或者Alt+Shift+C 最近更改的代码
Ctrl+R 替换文本
Ctrl+F 查找文本
Ctrl+Shift+Space 自动补全代码
Ctrl+空格 代码提示
Ctrl+Alt+Space 类名或接口名提示
Ctrl+P 方法参数提示
Ctrl+Shift+Alt+N 查找类中的方法或变量
Alt+Shift+C 对比最近修改的代码
Shift+F6 重构-重命名
Ctrl+X 删除行
Ctrl+D 复制行
Ctrl+/ 或 Ctrl+Shift+/ 注释（// 或者/.../ ）
Ctrl+J 自动代码
Ctrl+E 最近打开的文件
Ctrl+H 显示类结构图
Ctrl+Q 显示注释文档
Alt+F1 查找代码所在位置
Alt+1 快速打开或隐藏工程面板
Ctrl+Alt+ left/right 返回至上次浏览的位置
Alt+ left/right 切换代码视图
Alt+ Up/Down 在方法间快速移动定位
Ctrl+Shift+Up/Down 代码向上/下移动。
F2 或Shift+F2 高亮错误或警告快速定位
  • 代码标签输入完成后，按 Tab，生成代码。
  • 选中文本，按 Ctrl+Shift+F7 ，高亮显示所有该文本，按 Esc 高亮消失。
  • Ctrl+W 选中代码，连续按会有其他效果
  • 选中文本，按 Alt+F3 ，逐个往下查找相同文本，并高亮显示。
  • Ctrl+Up/Down 光标跳转到第一行或最后一行下
  • Ctrl+B 快速打开光标处的类或方法

WebStorm 显示行号 + 自动换 行+ 鼠标滚轮缩放设置

显示行号 + 自动换行

如果用 Vim 编程，行号是非常必要的辅助。WebStorm 默认是不显示行号的，没关系，显示行号非常的容易。

只要在代码左侧的 gutter 区域点右键，就会出现下图的菜单：勾选上 Show Line Numbers 即可。

另外，勾选上图中的 Use Soft Wraps 就启用了 WebStorm 的自动换行的功能，即过长的代码行不会超出屏幕，不会出现横向的滚动条。

值得一提的是，标准的 Vim，jk 是移到上一行下一行，如果代码自动换行了，被分割成的两行虽然看起来是两行，但其实是一个逻辑行，这时候用jk是上移下移一个逻辑行。这种情况下，如果要从同一逻辑行的“第一行”移动到“第二行”，需要按 gj ，即先按g再按方向。虽然Vim提供了这个方法，但还是经常按错。

好消息是，启用了 Use Soft Wraps 的 WebStorm 不需要这样，直接按j就可以从同一逻辑行的“第一行”移动到“第二行”。

Ctrl+滚轮缩放

菜单栏依次选择：File(文件) -> Settings(设置) 在弹出的窗口选择Editor(编辑器) -> General，然后勾选上 Change font size(zoom) with Ctrl + Mouse Wheel (Ctrl+鼠标滚轮改变字体大小)，就OK了！熟悉的快捷操作又回来了！

作者：李一Andy
链接：https://www.jianshu.com/p/96a71c8950de
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。