阅读更多

24顶
11踩

企业架构

转载新闻 JavaScript语法检查插件 jsLint for Vim

2010-11-15 09:06 by 资深记者 daisy8675 评论(3) 有6937人浏览

工欲善其事,必先利其器。作为更专业的前端工程师,我们需要强劲的IDE协助我们写出规范、美观、漂亮的JavaScript代码,首先要作的就是对代码进行合法性检查,而通过 www.jslint.com 进行手工操作又显得碍手碍脚。为了提高效率,这里推荐使用 jsLint + Vim(gVim),能够协助你达到事半功倍的效果。

 

首先,和 JavaScriptLint 不同[注1]jsLint 是需要 JavaScript 引擎的支持的,linux中可选的有基于 C 语言的 Spidermonkey 和基于 Java 的 Rhino,考虑到速度,推荐使用 Spidermonkey。另外,jsLint.vim 初始配置挂载的监听有些冗余,这会导致 Vim 运行很慢,影响编码的效率,这里我 hack 了一份 jslint.vim,只用F4键就可以开启/关闭语法检查,下面介绍配置方法(linux & windows)。

 

jsLint + vim for Linux

 

1,准备JS引擎

linux 下默认没有  JavaScript 引擎,需要安装,旧版本的 ubuntu 通过apt-get来安装。

 

sudo apt-get install spidermonkey-bin


新版的 ubuntu 需要通过下面这个包安装:
https://launchpad.net/ubuntu/hardy/i386/spidermonkey-bin/1.8.1.4-2ubuntu5
其他linux发行版可以通过源码安装:
ftp://ftp.mozilla.org/pub/mozilla.org/js/

 

2,安装ruby环境


ubuntu下安装:

sudo apt-get install ruby

 

redhet系发行版中的安装:

yum install ruby

 

3,安装vim,通常linux中自带,不用安装。

 

4,下载 jsLint 插件,下载后解压缩,把其中的 javascript 目录拷贝至 $VIM/plugin/中(作者给的文档有误,不应是$VIM/ftplugin/),当然也可以放到 ~/.vim/plugin/ 中。

 

5,将解压后 jslint/bin 目录中的 jslint 文件拷贝至 /usr/bin 中,也可以拷贝到~/bin/中。

 

6,下载 http://jayli.github.com/gallery/vim/jslint.vim 文件,覆盖 $VIM/plugin/javascript/jslint.vim。

 

7,完成,打开一个js文件,用F4唤醒语法检查,再按F4关闭语法检查。

 

jslint + gvim for windows

 

windows 下自带 CScript,不用再安装其他 JavaScript 引擎。

 

1,安装ruby运行环境。

 

2,安装 gvim,假设安装到 C:/Program Files/Vim 中。

 

3,下载 jsLint 插件,下载后解压缩,将 ftplugin 目录中的 javascript 文件夹复制到 C:/Program Files/vim/vim72/plugin/ 目录中。

 

4,将 jslint 解压缩后的“/bin/jslint”文件添加后缀名 “exe”,并将其所在的路径添加到环境变量的 Path 中,比如我将 jslint.exe 放到 C:/user/bachi/ 中,配置环境变量。

 

 

5,下载 http://jayli.github.com/gallery/vim/jslint.vim 文件,覆盖 C:/Program Files/vim/vim72/plugin/javascript/jslint.vim。

 

6,修改这个 jslint.vim 文件,将 vim 安装路径替换为绝对路径,找到

 

expand("~/vimfiles/ftplugin/javascript")

修改为

expand("C:/Program Files/Vim/vim72/plugin/javascript")

 

7,完成,打开一个 js 文件,用F4唤醒语法检查,再按F4关闭语法检查。

 

ps:其实很早之前,明城就介绍过使用 JavaScriptLint + Vim进行语法检查[注2], 这种方法也相当不错,但使用体验稍有缺憾,语法提示单独占用视窗,看起来更像专门的 Debug 操作,而我更希望在编码过程中,实时监控我刚写过的代码的正确性,而给出语法提示也不应当进入一个“Debug”过程,只要编辑过程中,我用眼睛余光能注 意到光标所在行的错误提示就可以了,没必要打开一个视窗给我看我有多少bug,另外,JavaScriptLint 的语法检查非常苛刻,我希望能有更加实用更加宽松的语法检查。很碰巧,jsLint 可以满足我这种挑剔的需求 ^_^

 

[注1]JavaScriptLint 的语法检查相比老道的 jsLint 更为苛刻,大量鸡肋警告非常干扰视线,比如  jquery-1.4.2.js 通过 JavaScriptLint 检查有164个警告,通过 jsLint 检查只有10个警告,正是因为此,JavaScriptLint 实际上增加了我们编码的负担。

 

[注2]:明城的文章中有小小的误导,JavaScriptLint 和 jsLint 是两个不同的东东,这里推荐的是老道的 jsLint,而不是JavaScriptLint。

来自: ued.taobao.com
24
11
评论 共 3 条 请登录后发表评论
3 楼 mu0001 2011-05-04 20:19
fjjiaboming 写道
写JS  还要检查插件 .
这样的程序员  不用做了..

自大的垃圾!
2 楼 fjjiaboming 2010-12-07 19:59
写JS  还要检查插件 .
这样的程序员  不用做了..
1 楼 welsryy 2010-11-15 11:31
用JavaScriptLint
V5 strict 模式要求蛮多的

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 使用Session实现一个用户只能登录一次

    普通项目: 这样一个账号可以在多个地方进行登录。在这个基础上修改实现一个账号只能登录一次,再次登录会把上次的登录的给挤掉,类似于QQ。 难点:怎么通过sessionId销毁session。因为Servlet2.1之后不支持SessionContext里面getSession(String id)方法。我们可以自己实现一个SessionContext。然后通过sessionId获取ses...

  • J2EE开源项目

    主要就我所了解的J2EE开发的框架或开源项目做个介绍,可以根据需求选用适当的开源组件进行开发.主要还是以Spring为核心,也总结了一些以前web开发常用的开源工具和开源类库   1持久层: 1)Hibernate 这个不用介绍了,用的很频繁,用的比较多的是映射,包括继承映射和父子表映射 对 于DAO在这里介绍个在它基础上开发的包bba96,目前最新版本是bba96 2.0它对Hiber...

  • JS语法检查插件 jsLint for Vim

    作为更专业的前端工程师,我们需要强劲的IDE协助我们写出规范、美观、漂亮的JavaScript代码,首先要作的就是对代码进行合法性检查,而通过 www.jslint.com 进行手工操作又显得碍手碍脚。为了提高效率,这里推荐...

  • JavaScript语法检查插件jslint + gvim for windows

    今天闲来无事儿,想着给神器gvim装几个实用的插件,于是就发现了jslint这个东东,以前都是通过www.jslint.com 进行手工操作,很是费劲,而且在工作中一般就不去检查了,干活要紧啊!哈哈 装了这个东西就方便多了...

  • jsLint for Vim

    这里有个 Vim 插件,能使用 jsLint 帮助检查 Javascript 脚本中常见的语法错误,所以这篇文章可以帮助延长 F5 的寿命。 首先, 下载 jsLint ,解压缩到某个目录,然后将这个目录加入到 PATH 环境变量中。然后, ...

  • javascript功能插件大集合

    awesome-javascript 是 sorrycc 发起维护的 JS 资源列表,内容包括:包管理器、加载器、测试框架、运行器、QA、MVC框架和库、模板引擎、数据可视化、时间轴、编辑器等等。伯乐在线已在 GitHub 上发起「JavaScript ...

  • Vim下的Web开发之html,CSS,javascript插件

    Vim下的Web开发之html,CSS,javascript插件 HTML 下载HTML.zip 解压HTML.zip,然后将里面的所有文件copy到C:\Program Files\Vim\vimfiles目录下首先,你应该把“ filetype plugin on ”写入你的vimrc。重启vim...

  • vim配置文件和插件管理

    vim配置文件和插件管理 本文通过总结零碎的资料总结而成,更多是去引导学习vim配置文件及插件使用。

  • web前端的vim插件配置

    Vim下的Web开发之html,CSS,javascript插件   HTML 下载HTML.zip 解压HTML.zip,然后将里面的所有文件copy到C:\Program Files\Vim\vimfiles目录下 首先,你应该把“ filetype plugin on ”写入你的vimrc。 ...

  • javascript功能插件大集合 前端常用插件 js常用插件

    管理着 JavaScript 库,并提供读取和打包它们的工具。 npm:npm 是 JavaScript 的包管理器。官网 Bower:一个 web 应用的包管理器。官网 component:能构建更好 web 应用的客户端包管理器。官网 spm:全新的静态包...

  • linux系统中VIM编辑器推荐安装插件

    k-vim VERSION: 9.0 LAST_UPDATE_TIME: 2015-05-02 作者 wklken (凌岳/pythoner/vim党预备党员) Email: wklken@yeah.net Github: https://github.com/wklken Blog: http://www.wklken.me 目标 ...

  • javascript功能插件大集合,写前端的亲们记得收藏

    awesome-javascript 是 sorrycc 发起维护的 JS 资源列表,内容包括:包管理器、加载器、测试框架、运行器、QA、MVC框架和库、模板引擎、数据可视化、时间轴、编辑器等等。伯乐在线已在 GitHub 上发起「JavaScript ...

  • 打造Linux下vim之(一)vim中的JavaScript插件

    (1)javascript格式化插件jsbeauty  下载地址: http://www.vim.org/scripts/script.php?script_id=2727  下载后放到 ~/.vim/plugin 下,然后再~/.vimrc中添加 、  nnoremap :call g:Jsbeautify()

  • 使用vim编写javascript代码

    如果你喜欢vim,平时也写写javascript,那么这篇文章就是为你而写的:)如果你喜欢javascript,但是还没有找到合适的编辑器,那么请give vim a try。...1. 语法高亮-javascript.vim http://www.vim.org/scr

  • vim 下web开发html css js插件

    Vim下的Web开发之html,CSS,javascript插件   HTML 下载HTML.zip 解压HTML.zip,然后将里面的所有文件copy到C:\Program Files\Vim\vimfiles目录下首先,你应该把“ filetype plugin on ”写入你的vimrc。重启...

  • 理解和正确使用Java中的断言(assert)

    理解和正确使用Java中的断言(assert) 一、语法形式:    Java2在1.4中新增了一个关键字:assert。在程序开发过程中使用它创建一个断言(assertion),它的语法形式有如下所示的两种形式:1、assert condition;    这里condition是一个必须为真(true)的表达式。如果表达式的结果为true,那么断言为真,并且无任何行动如果表达式为false,则

  • 深入剖析Java编程中的中文问题及建议最优解决方法--上篇

    深入剖析Java编程中的中文问题及建议最优解决方法--上篇 说明:本文为作者原创,作者联系地址为:josserchai@yahoo.com。由于Java编程中的中文问题是一个老生常谈的问题,在阅读了许多关于Java中文问题解决方法之后,结合作者的编程实践,我发现过去谈的许多方法都不能清晰地说明问题及解决问题,尤其是跨平台时的中文问题。于是我给出此篇文章,内容包括对控制台运行的class、

  • Jbuilder9.0+jboss-3.2.1_tomcat-4.1.24.zip+MySql/MS SQL Server2K开发环境配置手记

    Jbuilder9.0+jboss-3.2.1_tomcat-4.1.24.zip+MySql或MS SQL Server2K开发环境配置手记 网络上对Jbuilder9.0+JBOSS-3.2开发环境的配置说明的参考还很少,我在这里提供一个,请大家参考,并指教!这是我在配置这个开发环境时的一个手记。下面是详细步骤: 1、 安装Jbuilder9.0到D:/Jbuilder9目录2、 安

Global site tag (gtag.js) - Google Analytics