WebStorm“奇技淫巧”

2,471 阅读2分钟

本文介绍一些日常使用WebStorm的设置和快捷键。欢迎补充,互惠你我。 :upside_down_face: :clown_face:

WebStorm

版本: WebStorm 2017.2 操作系统:Mac OS

懒人一键配置主题、插件、CodeStyle

直接克隆这个仓库导入使用:github.com/YutHelloWor…

常用设置

设置Terminal字体

  • Preferences > Editsor > Colors & Fonts > Console Font

禁止实时自动保存

  1. Preferences > Apearance & Behavior > System Settings
  2. 取消勾选 "Save files on frame deactivation"和"Save files automa

tically if application is idle for"

文件未保存时显示星星(*)标记

  1. Preferences > Editor > General > Editor Tabs
  2. 勾选 “Mark modified tabs with asterisk”

设置鼠标双击选中驼峰式命名的变量

  1. Preferences > Editor > General
  2. 取消勾选 Honor "CameHumps" words settings when selecting on double click
  3. Preferences > Editor > General > Smart Keys
  4. 勾选 Use "CameHumps" words

启用Eslint校验JS代码

首先确保安装了Nodejs, 并且工程中配置了Eslint相关文件:.eslintrc.eslinignore

  1. Preferences > Languages & Frameworks > Javascript > Code Quality Tools > Eslint
  2. 勾选Eable
  3. 输入Node和Eslint路径
  4. 选中Automatic search 并Apply
  5. Editor > Inspections
  6. 取消勾选Javascript下的所有子选项
  7. 勾选Javascript > Code quality tools > 第一个Eslint
  8. Apply

Code Style

Preferences > Code Style 分别设置各个类型文件的代码风格。

支持JSX语法

  1. Preferences > Languages & Frameworks > Javascript
  2. 选择React JSX

快捷键

这里快捷键选用的是Mac OS

格式化

command + shift + L

快速定位变量、函数、模块声明源

command + 鼠标左键

多行光标

option + 鼠标左键

收藏代码某一行

收藏快捷键:将光标移动到目标行,按快捷键 F3 跳转至收藏的行: command+F3

高级
给收藏处标序号:option + F3

跳转到某行

command + L

打开某个文件

command + shift + o

查找和替换

  • 查找:command + f
  • 替换:command + r

全局查找和替换

  • 查找:command + shift + f
  • 替换:command + shift + r

以上只是很小的一些设置技巧,欢迎补充 :laughing: