WebStorm使用教程
发布于 1 年前 作者 gaofei1974 4594 次浏览 最后一次编辑是 10 个月前 来自 分享
教程说明

本教程参照 CodeCasts的"PhpStorm 使用教程"。phpstorm和webstorm都是JetBrains的IDE产品,所以配置和操作有相同之处。我把相关知识点记录一下,方便日后查询。在此特别推荐一下CodeCasts网站的视频教程,站长蛮用心的

我使用的是Mac系统,快捷键与Windows系统不同,以下快捷键以Mac为准。

Mac 和 Windows键盘对照表
Mac Windows
Control Ctrl
Command 徽标键
Option Alt

超级快捷键 Command+Shift+A:可以搜索到 WebStorm的所有配置选项

一、界面优化

去掉相关的 Bar
在菜单栏的view下勾掉所有的 Bar (Status Bar、Navigation Bar等)。
去掉标签 (Tabs Placement)
右击标签,选择Tabs Placement -> none,如果想显示, Command+Shift+A下搜索Tabs Placement后选择显示位置。
去掉面包屑导航
Command+Shift+A下搜索 breadcrumbs,选择Don't Show。
去掉代码折叠轮廓线
  Command+Shift+A下搜索 Code Folding,取消 code folding outline。
  快捷键:Command++(展开)、Command+-(折叠)
去掉代码分割线(此项有疑问,后续再修改)
  Command+Shift+A下搜索 show method separators并取消。
显示和隐藏SideBar
  使用Command+1 显示和隐藏SideBar。
去掉左边竖线
  Command+Shift+A下搜索 show right margin(configured in Code Style options)并取消。
美化界面和字体设置
  - 主题设置:Command+, 打开偏好设置,依次选择 Editor -> Color Scheme (我使用Mokonai)
  - 字体设置:Command+, 打开偏好设置,依次选择 Editor ->Font (我使用Fira Code、字体大小16、字间距1.4)
  - SideBar 字体设置:Command+Shift+A下搜索override default fonts by...,勾选后选择字体和设置大小

二、重要的快捷键

自定义快捷键
  Command+Shift+A下搜索keymap,查找需要修改的快捷键,进行修改。查找时可以直接输入需要修改的项目名称,也可以输入项目之前的快捷键。
快捷键列表
  - 快速查找和打开文件:Command+P(默认是Command+Shift+O)
  - 显示指定对象的属性和方法 (File Structure):Control+Command+M (默认是Command+F12)
  - 在已打开的文件中快速跳转:Command+E
  - 快速查找和打开对象或方法:Command+Option+O
  - 快速创建文件或文件夹:Command+Up后选择对应的文件夹,再Command+N,创建文件或文件
  - 偏好设置 (preference):Command+,

三、文件模板(File Template)

 Command+Shift+A下搜索File Template, 配置和添加文件模板。

四、代码片段(Live Templates)

 Command+Shift+A下搜索Live Templates [preferences], 配置和添加代码片段。

五、代码的格式化及美化(Live Templates)

 - Command+Option+L:格式化代码
 - Command+Shift+A下搜索Code Style,这里可自定义代码格式 

六、插件(Live Templates)

 - IdeaVim:安装启用后可使用vim方式编写代码

七、代码重构

 选择需要重构的代码段,Control+T 呼出菜单,选择重构方式,也可使用快捷键直接进行重构操作
 - Command+Option+V: 变量重构 (Varibale)
 - Command+Option+M:方法重构 (Method)
 - Command+Option+N:   对变量或方法的重构还原 (inline)

八、多点编辑 (相同的单词同时编辑)

 - Command+D:  逐个选择单词 (默认快捷键Control+G)
 - Control+Command+G:选择全部的单词
7 回复

已经放弃WB , 改用VSCode . 因为很卡卡卡。。。

@NextZeus VSCode在Mac下可以使用吗?

@NextZeus VSCode有WB集成方便么?对于一些依赖的外部环境

@thuai WB是很方便,但方便是有代价的,那就是消耗很多的内存[启动后基本上就是1.5G±]。这是我换VSCode很大的原因。
依赖环境这块,应该可以通过安装插件去解决吧 。当然 我不是说WB差😄,毕竟我也是使用了好几年了。

@NextZeus 同样改成VS Code,不过完全是因为最近一直在用ts…

回到顶部