WebStorm 实用小技巧

Published by powerfulyang on Mar 7, 2022

• command + shift + f // 全局搜索
• double shift // search everywhere
• command + G // 查找下一个
• command + shift + G // 查找上一个
• command + F12 // File Structure popup

• command + shift + v // 从剪切板里选择黏贴
• command + delete // 删除当前行
• command + d // 复制行
• command + shift + up/down // 上下移动当前行代码
• command + alt + t // 增加环绕标签(if..else, try..catch, for, etc.)
• command + y // 小浮窗显示变量声明时的行
• control + j // 获取变量相关信息（类型、注释等，注释是拿上一行的注释）
• f2, shift + f2 // 切换到上\下一个突出错误的位置
• command + [ ] // 光标现在的位置和之前的位置切换
• command + shift + delete // 导航到上一个编辑位置的位置
• command + b // 跳转到变量声明处
• command + up // 跳转到导航栏
• command + shift + [ ] // 文件选项卡快速切换
• command + shift + c // 复制文件的路径
• command + shift + u // 大小写转换
• command + f8 // 添加断点
• alt + shift + g // 多行编辑。 用鼠标框选需要编辑的代码, 然后按alt+shift+g就会跑到各行的末尾
• command + ←, command + → 光标跳转到首尾
• alt + ← → 隔单词跳转

• option + shift + enter // Add all unambiguous imports

Settings -> Editor -> General -> Auto Import 下的 Unambiguous imports on the fly 很有必要开(特别是搭配 GitHub Copilot 的时候), 更详细的说明

比如使用 antd 时，import statement 总是会提示 antd/lib/* 或者 antd/es/* 干扰选择，这时候设置 Settings->Editor->Code Style->Typescript 里面的 Imports tab 中的该设置为:

1rxjs/Rx
2node_modules/**
3**/node_modules/**
4@angular/material
5@angular/material/typings/**
6antd/**/*
7@ant-design/pro-form/**/*

就可以避免干扰项出现。

Choosing Based on type: as Add for JSX attributes value in Settings | Editor | Code Style | HTML, Other 建议设置为 Braces, Based on type 就一个字不实用。

单行太长影响阅读，使用 double shift 搜索 soft-wrap, 快速设置。