Webstorm

Webstorm相关知识整理，介绍webstorm的基础使用和基础配置方法以及常用插件安装，喜欢的小伙伴可以点个赞哦！

Webstorm

• 界面
  • 界面布局
    • 菜单
    • 工具
    • 导航
  • 切换界面布局
    • View->Tool Windows
    • 快捷键
      • Alt+1
        • Project项目窗口
      • Alt+2
        • Favorites喜好窗口
      • Alt+6
        • TODO窗口
      • Alt+7
        • Structure结构窗口
      • Alt+8
        • Services服务窗口
      • Alt+9
        • Git窗口
      • Alt+F12
        • Terminal终端窗口
• 基本使用
  • 创建项目
    • file->new project
  • 创建文件
    • 右击项目->new->file
  • 重命名
    • 右击文件->refractor->rename
  • 删除文件
    • 右击文件->delete
  • 文件编辑后会默认自动保存
  • 文件内右键-->local history-->show history
    • 查看编辑历史
    • 子主题
• 高级技巧
  • 基本配置
    • File->settings进入配置
    • 常用配置
      • 全局主题
        • Appearance->Theme
      • 编辑器主题
        • Editor->Color Scheme
        • 可单独配置编辑器的显示主题，会询问是否更改全局主题
          • yes则全局主题同步更改
          • no则只更改编辑器主题
      • 快捷键
        • Keymap
      • 字体设置
        • Editor->font
      • 长代码自动换行设置
        • Editor->General->Soft Wraps->打开Soft-wrap these files
          • 按格式配置想自动换行的文件后缀
          • *.html;*.css;*.js;
      • 关联浏览器配置
        • Tools->Web browsers
    • 开启关闭代码提示
      • File->Power Save Mode
      • 是否开启省电模式
        • 是则关闭代码提示
        • 否则开启代码提示
    • 自定义模板
      • File->Settings->Editor->live template
        • 操作步骤
          • 1. 选中需要添加模板配置的文件类型
          • 2. 点击加号，添加live template
          • 3. 设置缩写名称<abbreviation>
  • 插件安装
    • 下载地址：https://plugins.jetbrains.com/
    • File-->settings-->plugins
    • 优秀插件推荐
      • 主题
        • Material Theme UI
        • atom one dark
        • Monokai pro
      • 翻译
        • Translation
      • Git
        • Git Commit Trmplate
          • git提交自动补充模板前缀
        • GitToolBox
          • 选中代码在行尾会提示提交人，提交时间等信息
        • .ignore
          • 将不想提交的代码自动添加到.gitignore文件中
      • 代码提示
        • Codota
          • AI代码联想工具
      • 汉化
        • Chinese（Simplified）Language Pack
  • 常用快捷键
    • 快速批量选中相同代码
      • Alt+j
        • Vscode中为Ctrl+d
        • 单个去选中
      • Alt+右键拉动/点击
        • 可批量选择右键选中的代码 然后可以同步编辑
      • Ctrl+shift+Alt+j
        • 直接选中文件内所有选中的代码
        • 全局多选
          • 同步修改,统一编辑
    • 批量替换
      • 文件内批量替换
        • Ctrl+r
      • 指定目录内批量替换
        • Ctrl+shift+r
    • 搜索
      • 开启全局搜素
        • shift+shift
      • 当前文件搜索
        • Ctrl+f
      • 查找文件
        • Ctrl+shift+n
          • 通过文件名查找
        • Ctrl+shift+alt+n
          • 通过文件内关键字符查找
    • 注释
      • 单行注释
        • Ctrl+/
      • 多行注释
        • Ctrl+shift+/
    • 行处理
      • 删除行
        • Ctrl+x
      • 复制行
        • Ctrl+d
      • 上下移动行
        • Ctrl+shift+上下箭头
      • 查找行
        • Ctrl+g
      • 重新开始一行
        • shift+enter
    • 代码块操作
      • 自动折叠代码块
        • Ctrl+'-'
      • 展开代码块
        • Ctrl+'+'
      • 选中代码块
        • Ctrl+shift+[
        • Ctrl+shift+]
      • 匹配括号
        • Ctrl+[
        • Ctrl+]
    • 快速打开光标处的类或方法
      • Ctrl+b或者Ctrl+单击
    • 代码自动格式化
      • Ctrl+alt+l
    • 快速选中单词
      • Ctrl+w
• 其他
  • 与Vscode的对比
    • 优点
      • 操作更流畅，开箱即用，不用安装大量插件
      • 代码提示更流畅更智能
      • 文件自动保存，不用单独Ctrl+S
      • 可显示编辑历史，一键revert还原
      • Git merge更智能
      • 更多优点有待探索
    • 缺点
      • 占用内存较大，约为vscode的三倍
        • 解决:电脑内存16G以上直接无视
      • 首次打开项目时间较长
        • 忍耐一下首次打开，后面就香了
        • 为了不频繁开启，可以不关闭电脑和Webstorm
      • 自定义插件开发难度更大

常用的快捷键

• 分类
  • 选中当前行代码
  • 移动当前行代码
    • ctrl+shift+上下箭头
  • 提交代码到git本地
  • push代码到git远程仓库
  • 全局搜索
  • 当前页搜索
  • 全局搜索字段
  • 替换当前文档
  • 全局替换字段
  • 格式化代码
  • 使文件，标签，变量名重命名
  • 切换到上\下一个突出错误的位置
  • 无论在什么位置，自动跳到下一行
  • 警告代码快速给出自动修正
  • 跳到代码调用位置
  • 删除当前行
  • 复制新增一行一样的代码
  • 关闭当前文件选项卡
  • 子主题
  • 子主题