webstrom的基本使用

webstrom的基本使用

1.1 webstrom的介绍

WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。目前已经被广大中国JS开发者誉为"Web前端开发神器"、"最强大的HTML5编辑器"、"最智能的JavaScript IDE"等。与IntelliJ IDEA同源，继承了IntelliJ IDEA强大的JS部分的功能。 在此之前，首先下一个webstrom(这里我们用的是2017-03-26发布的版本)

1.2 webstrom的安装

webstrom2017.1.2下载地址

webstrom注册码 下载好之后，点击安装（注： 安装这一部分就不介绍了，没有什么需要注意的地方）

1.3 webstrom的使用

1.3.1 webstrom常用的快捷键

• 自动注释和撤销注释(行注释/块注释)：Ctrl+/ 或 Ctrl+Shift+/
• 查找文本 Ctrl+F
• 替换文本 Ctrl+R
• 复制行：Ctrl+D
• 方法参数提示 Ctrl+P
• 通过文件名快速查找工程内的文件 ctrl+Shift+N
• 全局查找 shift+shift
• 通过一个字符快速查找位置 ctrl+Shift+alt+N
• 高亮错误或警告快速定位 F2 或Shift+F2
• 快速打开光标处的类或方法 Ctrl+B或Ctrl+鼠标左键单击
• 自动补全功能 比如想敲一对h1标签，只需要敲h1,按 tab 键，变回自动补全为:
  更多代码补全的技巧可以参考 Emmet使用手册 阮一峰的网络日志
• 自动整理代码格式进行对齐：Ctrl+Alt+L (不过小心被冲突了，比如qq锁的快捷键就是Ctrl+Alt+L，QQ开着的话会使快捷键没有效果。)
• 更多高效的快捷键请参考Intellij Idea/Webstorm/Phpstorm 的高效快捷键

1.3.2 webstrom的一些配置

修改主题和字体

ctrl+alt+s打开Settings界面，Editor > Colors&Fonts > Font。

这里我用的主题是 MrZuraOneDark 字体是consolas

导入主题

webstrom主题下载

将下载好的文件（一般是.icls文件类型）放入安装目录下。我的是C:\Users\15984.WebStorm2017.1\config\colors，然后重启webstrom，在Settings界面修改主题的时候，会发现多了我们从网上下的主题了

terminal(终端字体设置)

ctrl+alt+s打开Settings界面，Editor > Colors&Fonts > Console Font。设置过后，需要重启webstrom

最终界面

然后我们可以打开我们的项目了，准备开启前端开发之路吧！