图文解说WebStorm快捷键Mac版(一)---Editing

2,412 阅读4分钟

Mac版参考快捷键

这篇文章是mac版的快捷键,参考官方的快捷键给出映射顺序来写的。但是并不是说不适用于Win,Win参考下面的快捷键调出界面WebStorm-Help-Key Reference

  1. 使用此教程的基本条件是自己之前设置的快捷键需要恢复成WebStorm默认的
  2. Gif里面的代码只是用来演示如何使用快捷键的,不要喷代码垃圾奥~
  3. 里面那个代码有黄色波浪线的提示,不要告诉我了,我知道怎么关闭这些提示,没弄而已
  4. 后续会出包括但不限于下面这些:设置主题、字体大小、自定义快捷键、自定义格式化代码、设置代码模版、使用Prettier格式化代码、自定义CSS书写顺序、插件系列、修改npm工具
  5. 推荐指数是1-3颗星的后面都会自定义成自己的快捷键

其他教程请戳这里

图文解说WebStorm快捷键Mac版(二)---Multiple carets and selections

Editing

这部分主要是涉及到代码编辑的操作。弹出框可以用鼠标点击的都可以用上下键来切换选择。

⌃Space 推荐指数⭐️

我用的是Vant框架。可以看到在按下快捷键会提示框架的相关属性可供自己选择。但是需要注意的需要放到前面的标签内,不能放到结尾,不然会有无建议的提示。实测:在位置上使用Space键也是可以的。

⌥⏎ 推荐指数⭐️

显示快捷可以修复的建议/其他操作

⌘P 推荐指数⭐️

也是提供框架的属性,实际用处不多

⌃J 推荐指数⭐️

快速查看documentation的视图,实际用处不多

⌘ Mouse Over Code 推荐指数⭐️⭐️⭐️

首先不要被名字搞不懂如何操作。说白了就是按下⌘的同时,鼠标悬浮在代码上面。可以来回跳转,秘笈反复横条

⌥F11 推荐指数⭐️⭐️

项目快速运行,不需要点击右上角需要运行的配置文件

⌃⏎/⌘N 推荐指数⭐️

显示版权之类的信息

⌥⌘T 推荐指数⭐️⭐️⭐️⭐️

增加代码环绕,尤其是if else

⌘J 推荐指数⭐️⭐️⭐️⭐️

插入代码模板,这个可以自己定义。后续会出教程

⌘/ 推荐指数⭐️⭐️⭐️⭐️⭐️

注释单行代码

⇧⌘/ 推荐指数⭐️⭐️⭐️⭐️⭐️

注释多行代码

⌥↑/⌥↓ (个人自定义成⌘↑/⌘↓)推荐指数⭐️⭐️⭐️

逐渐向外围扩展选中/取消。⇧⌥↑/⇧⌥↓将选中的上移/下移

⌃⇧Q 推荐指数⭐️

个人感觉这个没什么用,没写

⌥⌘L 推荐指数⭐️⭐️⭐️⭐️⭐️

不用多说,格式化代码。后续配置Prettier格式化这个按键基本就不需要了

⌥⌘I 推荐指数⭐️

这个快捷键无法复现。估计和Mac的快捷键冲突了,不解决了。就这样吧hahaaa~

⇥/⇧⇥ 推荐指数⭐️

控制代码的向右缩进/向左缩进。这个有了Perttier也没啥用了

⇧⌘V 推荐指数⭐️⭐️⭐️⭐️⭐️

从历史里面粘贴。仅限于之前在Webstorm里面复制过的

⌘D 推荐指数⭐️⭐️⭐️⭐️⭐️

重复复制当前光标所在的行

⇧⌫ 推荐指数⭐️⭐️⭐️⭐️⭐️

删除当前光标所在的整行

⇧⌥↑/⇧⌥↓ 推荐指数⭐️⭐️⭐️

这个在⌥↑/⌥↓说明了,不细说

⌃⇧J 推荐指数⭐️

把不在一行的代码放到一行,然并卵~

⌘⏎ 推荐指数⭐️

换行 然并卵~

⇧⏎ 推荐指数⭐️⭐️⭐️⭐️⭐️

光标在任意位置直接向后换行

⇧⌘⏎(默认是⌥⌘⏎,方便记忆 自定义了一下) 推荐指数⭐️⭐️⭐️⭐️⭐️

光标在任意位置直接向前换行

⇧⌘U 推荐指数⭐️⭐️

将选择的部分大小写切换

⇧⌥⌘]/⇧⌥⌘[ 推荐指数⭐️⭐

从当前位置选中到开始或结尾

⌥⌫/⌥⌦ 推荐指数⭐️

当前位置删除到词头/词尾。注意这里是单词,不是整行

⌘+/⌘- 推荐指数⭐️⭐️⭐️⭐️⭐️

展开代码/折叠代码

⇧⌘=/⇧⌘- 推荐指数⭐️⭐️

全部展开/折叠代码。这里是=,不是+但都是同一个按键。如果全部展开不管试试全选,然后输入法切换到英文应该就可以了

⌘W 推荐指数⭐️⭐️⭐️⭐️⭐️

关闭当前页面 适用于打开的标签栏/设置弹窗 除了关闭标签栏不能用esc外,大部分也可以用esc按钮