webstorm-external-tool

Webstorm这个IDE在前端开发人员中应该不陌生,甚至连NodeJS的后端开发,这都是十分优秀的IDE之一。

JetBrain这家公司开发出来的IDE都十分优秀,大家耳熟能详的还有PhpStorm、AndroidStudio。
他们家产品辨识度非常高,只要用过一款,其他的产品一眼就能分辨出来:)

在使用了hexo和grunt之后,每次部署博客和执行任务都非常麻烦。cmd默认是在C盘的用户目录底下,每次都要切换到工作路径,然后还有敲命令。十分的低效。
Webstorm如此智能,那他能不能帮我们把这么繁琐的操作也完成呢?答案肯定是可以,不然也不会写这篇博客了☺

打开Webstorm的设置界面。你可以选择三种方式来完成

  • 菜单栏: File -> Settings
  • 快捷工具栏上的Setting图标
  • 快捷键: Ctrl + Alt + S

选择External Tools:

点击右边的 “+”:

这里我们需要填的地方有5处:
- Name: 填写一个显示的名称
- Group: 工具的分组名称
- Program: 填写要执行的程序。(hexo命令行工具安装在了Npm目录下)
- Parameters: 附加的参数。
- Working directory: 执行路径(这里有个小窍门,就是点击后面的Insert macro…按钮,在里面选择ProjectFileDir,这样无论在项目内任意地方执行该工具,对应的路径都是项目的根目录)

设置完成后点击OK保存,然后我们回到编辑页面,在任意地方右击就能看到我们添加的工具啦!

运行后能看到下面的界面,无论是重启、暂停、清除日志都非常简单。

Hexo指令

>


Originally published at datoulei.github.io on May 17, 2014.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.