打造“前端开发”程序员专用版EditPlus

在各类的前端开发工具里，在功能上虽然Editplus显得有些“单薄”，但是仍然是很多我辈做开发的人们离不开的工具，因为他小巧，语言高亮，支持工具扩展等功能，通过工具扩展，你甚至可以把它打造的强大无比。

本人一般用editplus写一些小的测试代码或者来研究学习别人的代码，但经常会遇到这些问题：下载过来的HTML/CSS代码混乱，JS代码被压缩，或者是我们想把我们的代码做一下压缩混淆以供发布时使用。当然，对于代码的格式化和代码压缩等，我们都可以使用专有的工具，或者使用一些在线的工作来做，既然EditPlus可以扩展插件，那我们何不利用这一功能来把这些工具集成到EP中呢？

其实很早我都有这些想法，一直没有深究其做法，EP的用户工具组，我一般也是挂些帮助手册之类的供开发时参考。昨天在BlueIdea看到有人发了一篇名为“让Editplus自动格式化css和js”的文章，看完后觉得写的很好，我也突然来了灵感，为什么不把前端开发常用工具都集成进去呢？

说做就做，我在网上找了一些相关的工具代码，按照作者的方式开始改造（作者是使用“本地cScript调用JS+EP的文本过滤器”的方式来实现的）。

这里我整理了如下一些工具（HTMLFormat/JSFormat/CSSFormat/JSPack(普通压缩与混淆压缩)/HTML2JS(JS2HTML)）。

下面来说下集成的方法（以下以EditPlus3中文版本为例）：

1. 下载工具包：edTools.rar,解压后放到磁盘的一个目录，如D:\edTools。

2. 打开ED，打开“工具”-“用户工具组”，在弹出的对象框中，在“组和工具项目”下拉框中选择一个工具组，点击“组名称”，为该组工具设定一个名称，如“前端开发工具”，如下图所示：
   

3. 下面开始加入工具，这里主要以JSFormat为例讲解，其它类似。
   点击“添加”--“应用程序”，在新建的项中，菜单文本写上名称，如"jsFormat"，在命令里面输入：

   cscript /nologo "D:\edTools\jsFormatter.js"

   后面引号中的内容要修改你磁盘上对应的文件的路径。
   在下面的几个选项中，选择“运行为文本过滤”。如下图所示：
   

4. 其它几个的安装方式与jsFormat的安装类似，这里不再重复。
   对于jsPacker和html2js两个文件，这里要做下说明，因为这两个文件都分别包含两个功能，因此我以参数的形式来做区分了，下面对这两个文件做简要说明：
   jsPacker.js：如果不传参数，则做普通的JS压缩，即将代码中的空格、换行、注释等删除，如果含有参数，则采用混淆压缩。
   html2js.js：如果不传参数，则是html转js，如果传入参数则是js还原为html的。
   因此，对于普通js压缩和html转js，我们只需和jsFormat一样设置即可。对于JS加密压缩和js转js，需要再设置一个参数传入（随意设置一个参数即可），如下图。
   

5. 配置完成以后，点击确定。然后点“工具”--“用户工具组”，选择我们刚才创建的工具组（如过你用的是工具组，这步可以略过）。
   

6. 这时候再看你的工具菜单，应该是这样子了。
   

到这里就完成了，你可以打开一个JS文件，然后选择“工具”--“jsFormat”看看格式化的效果，或者选择jsPacker/jsPacker(加密)试一下代码压缩。如果只想格式化文件中的某部分代码，也很简单，选中我们要格式化的文本，然后点击相应的操作菜单即可。

是不是觉得自己的EdithPlus又强大了许多？自己的一点心得，分享出来，希望对各位朋友有用，大家也可以利用这个功能来扩展自己一些功能。