webstorm有那些好用的特性

Webstorm 是一个强大的前端开发 ide，大多数人使用 webstorm 的主要原因应该是它 NB 的智能提示功能。强大的智能提示只是它的一个功能特性，它还具有许多有用的特性，比如版本控制、本地历史、即时模板等。这里我列一下对我来说非常有用的功能。

Version Control - 版本控制

webstorm 集成了多种版本控制工具，基本的功能都可以使用，只是快捷键是个蛋疼的事情。

使用：如果项目已经有了版本控制相关的文件夹，比如 .git。在 project 或者 编辑器右键可以看到对应的菜单。如果有这些文件夹，但是没有出现版本控制的相关功能，可以到 Preferences 那里设置。 Preferences > Version Control。



Version
Control

Local History - 本地历史

本地历史我觉得是非常有用的功能，他可以查看本地的修改历史，随时可以恢复某个时间的修改。用其他的版本控制工具只能比较提交的修改。

使用： 右键即可看到 local history 菜单, 选择某个版本，点击revert恢复



local
history

Live Templates - 即时模板

live template 跟 Sublime
text 的 snippet 类似，提供代码模板的功能，通过模板快速编写一些固定样式的代码。

使用：

Webstorm > Preferences > Live Templates 打开设置。

点击右侧的添加按钮，添加一个 live template.

编写代码模板，abbreviation: 触发关键字，description: 智能提示框会出现的描述。点击输入框下面的Define可以选择触发这个模板的文件类型。右边是一些配置选项。

在编辑器中输入触发关键字，按 Tab 键可以看到生成的模板，继续按 Tab 可以修改模板的变量。



live
template

coffeescript

webstorm 支持coffeescript的即时编译、代码提示、代码跳转，代码调试等功能。

使用：

安装 nodejs 和 coffeescript

Preferences > File Watchers 添加coffeescript的watcher。

其实安装了coffeescript的话，webstorm 会有提示问你要不要添加watcher的，点击 add watcher 会自动启用的。出来 coffeescript, webstorm 还支持很多种 watcher，比如 less 、sass、stylus 等。

Node.js 支持

webstorm 支持 Node.js 调试。具体设置看：使用
webstom 调试 node js 程序

目录设置 - Directories

项目目录一般会有一些我们开发过程中不需要的文件夹，这些目录有时候特别碍眼，查找的时候也查找他目录下的文件。设置 Directories 可以将这种目录排除掉，而且在 Project 那里会看不到这个目录。

使用：选择一个文件夹，右键, Mark Directory As > Exclude, 可以在 Preferences > Directories 那里设置，那里还可以将之前排除掉的文件夹恢复。

多光标

用 sublime text 的时候，我非常喜欢这个功能，但是在 webstorm 8 之前，webstorm 是不支持的。现在 webstorm 8 支持了这个功能，而且比 sublime text 还要强大，让我非常欣慰。

使用:

option + click 在点击处生成光标, esc 取消

control + g 如果之前没有选择内容，则在相同的单词处生成光标，如果之前选择了内容，则在相同内容处生成光标，操作一次匹配一次。



multi
cursor

代码格式化 - format code

很多时候，我们在网上找到的代码的格式比较乱，或者不符合我们项目的规范。webstorm 提供了代码格式化的功能，可以格式化一个文件，也可以格式化选择的内容。格式化的标准是按照 Preferences > Code Style 那里设置的代码格式。Code Style 可以设置全局默认的格式，也可以针对当前项目设置格式。

使用：

快捷键： option + commad + l

菜单：Code > Reformat Code

deployment 部署项目

webstorm 内置ftp支持，可以使用ftp将要部署的代码上传到服务器。

使用：

配置ftp，Tools > Deployment > Configuration. 右上角可以添加一个ftp服务器。Mappings 可以将本地目录和服务器目录相关联，deployment 时候直接将本地目录上传到对应的服务器路径。

配置好后，可以在编辑器中右键调出 deployment 菜单（只有 mappings 设置的本地路径下的文件才有这个菜单），这样可以上传单个文件，如果想上传某个目录的话，可以在 Project 那里选择一个文件夹，右键即可出现 deployment 菜单。

如果想看一下服务器的文件，可以使用 browse remote host. Tools > Deployment > Browse Remote Host