你的JavaScript工具链是什么?

我正在寻找开始在JavaScript上编写一个复杂的应用程序在networking上运行。 我之前用JavaScript写了一点点的一次性代码,直接使用DOM和一点点jQuery。 但是这是我第一次想写一个完整的应用程序在浏览器中运行。

所以,我想知道什么工具链人们喜欢在JavaScript中进行认真的开发。 特别是,我对以下内容感兴趣,并提供了一些有关为什么select所做组件以及它们如何融入工作stream的信息:

  • 你使用什么编辑器和编辑器插件/模式/脚本? 我通常是一个Emacs用户,目前我正在使用js2.el ,但是我有兴趣了解其他的设置。
  • 你使用任何types的IDE(Aptana,Dashcode或类似的)?
  • 你使用的是什么JavaScript库或框架?
  • 你使用任何编译成JavaScript的语言(GWT,haxe,Objective-J)?
  • 你使用什么unit testing框架? 你如何援引他们? 他们可以从你的编辑器/ IDE,从命令行,浏览器的网页,从你的JavaScriptdebugging器?
  • 你使用什么自动化的用户界面testing工具(如Selenium,W​​atir,Sahi)? 再次,这些如何被调用? (能够从命令行调用unit testing和接口testing对于运行buildbots是非常有用的)
  • 你使用了什么其他的代码质量工具(JSlint,代码覆盖工具,或其他类似的东西)?
  • 你在debugging环境中使用什么(Firebug,WebKit inspector等)? 它是否与您的编辑器或IDE有任何集成?
  • 在部署代码(混淆器,缩小器,任何types的优化器)之前,您会对代码执行哪些后处理?
  • 你有什么样的工具来pipe理模块依赖关系,或者根据需要dynamic加载代码? 我正在编写的应用程序将使用大量的代码,并且我想保持加载时间的下降,所以跟踪需要什么模块或按需加载代码的工具将会有所帮助。
  • 在你的工具链中是否还有其他重要的工具(特定于基于浏览器的应用程序的JavaScript开发;我已经有了一个完美的版本控制系统,错误跟踪器等)?

我对“这里有很多你可以使用的东西”(我知道有很多可用的工具)列表不太感兴趣,还有更多的实际使用中的堆栈,一起。 我希望开发这主要作为客​​户端应用程序,服务器只是用于身份validation和存储和检索数据,所以我不感兴趣的是你使用的是什么服务器端框架,除非它是客户端在某些方面代码。

编辑 :我特别感兴趣的单位和用户界面testing框架,以及如何自动化他们。 我更喜欢能够从命令行运行一个单独的“make test”或“rake test”任务来运行项目的所有testing,并根据testing的成功或失败情况返回状态。 这将允许与buildbots更容易的集成。 另外,如果有人写的unit testing可以在浏览器之外运行(在Rhino,spidermonkey,v8或类似的地方),而不依赖于浏览器的代码,可以更快速地转换你的子集试验。

你使用什么编辑器和编辑器插件/模式/脚本? 我通常是一个Emacs用户,目前我正在使用js2.el,但是我有兴趣了解其他的设置。

我通常使用Textmate (使用JavaScript , jQuery和Prototype包)。 在进行繁重的前端开发时,我会在HTML,CSS和JavaScript文件之间快速切换,我将selectvim的分割面板视图。 这样做的时候,我根据自己的心情使用macvim或者Terminal + Visor 。 显然,我是一名Mac用户。

你使用任何types的IDE(Aptana,Dashcode或类似的)?

不,我曾经使用过Coda ,但是它的文本编辑function还有很多不足之处。 我也玩弄浓咖啡 ,这很有趣…但是,

你使用的是什么JavaScript库或框架?

我使用jQuery和Prototype ,这取决于项目的需要。 为了说明每个框架的优势,我喜欢将jQuery作为DOM操作框架 ,将Prototype作为脚本框架 。 因此,我倾向于在关注标记和原型的项目上使用jQuery,而这些项目更重要的是脚本化的应用程序types的项目。

你使用任何编译成JavaScript的语言(GWT,haxe,Objective-J)?

绝对不是 – 我对这样的框架有哲学的抱怨。 与服务器端代码不同,前端代码正在用户的浏览器中运行,在您无法控制的环境中运行。 因此,我认为这是一个JavaScript开发者的责任,可以产生最好的代码 。 不理想的代码可能会带来性能方面的影响,而像Objective-J这样的语言编译的JavaScript(这是我使用过的唯一一个)将永远不会像强大的JavaScript开发人员所产生的代码一样紧密。

你使用什么unit testing框架? 你如何援引他们? 他们可以从你的编辑器/ IDE,从命令行,浏览器的网页,从你的JavaScriptdebugging器?

我是jQueryunit testing框架QUnit的忠实粉丝。 Dojo的DOHunit testing也很好。

不要错过FireUnit ,unit testing的一个漂亮的Firebug扩展。

另见剃刀 。

你使用什么自动化的用户界面testing工具(如Selenium,W​​atir,Sahi)? 再次,这些如何被调用? (能够从命令行调用unit testing和接口testing对于运行buildbots是非常有用的)

必要时使用selenium ,但这是罕见的。

你使用了什么其他的代码质量工具(JSlint,代码覆盖工具,或其他类似的东西)?

我使用和爱JSLint 。

Firebug有一个很好的代码覆盖扩展 , HRCov被广泛认为是最好的品种。 在我的大部分日常JavaScript工作中,我没有发现代码覆盖的用处。

你在debugging环境中使用什么(Firebug,WebKit inspector等)? 它是否与您的编辑器或IDE有任何集成?

就我而言,Firebug是JavaScript开发的杀手级应用程序。 一些有用的debuggingfunction:

  • 可变的工具提示
  • 断点和条件断点
  • 性能分析器
  • 一个非常漂亮的控制台API
  • 观看表情
  • 堆栈痕迹
  • 有用的插件像Jiffy , FireCookie和FireQuery 。

WebKit Inspector很不错,就像DragonFly一样 , Debug Bar可以用来跟踪IE的bug,但FireBug是我的一个。

在部署代码(混淆器,缩小器,任何types的优化器)之前,您会对代码执行哪些后处理?

我非常有意地不使用任何后期处理工具 – JavaScript的一个重要方面就是开放性,而且我不愿意让刚刚起步的JavaScript开发人员更难以从我的工作中学习。 更不用说重构混淆JavaScript是非常简单的。

只有一个例子,我需要缩小JavaScript来节省带宽。 在这种情况下,我build立了一个SVN post-commit hook来运行Doug Crockford出色的JSMin 。

在你的工具链中是否还有其他重要的工具(特定于基于浏览器的应用程序的JavaScript开发;我已经有了一个完美的版本控制系统,错误跟踪器等)?

  • alert()函数;)
  • 另外,一个不错的JSONvalidation器是有用的。
  • Visual Event对事件debugging很有用
  • jsfuzzer ,为fuzzing
  • 我不需要使用它,但Crosscheck在我的工具箱中。

在提出这个问题的时候, Google的封闭编译器并没有争论。
这是一个非常好的工具,可以比其他许多其他工具更好地优化JavaScript。 你可以运行它的页面速度来分析现有的网站。 它内置了很多其他的function,比如检测死代码,引用等等。

  • IntelliJ IDEA / RubyMine进行编辑。
  • jQuery +插件,因为它与Ruby相似
  • 你使用任何编译成JavaScript的语言(GWT,haxe,Objective-J)?
  • 带有Blue Ridge(Rails包)的JSUnit,但更多地依赖于Seleniumtesting
  • 除编程和testing之外,没有代码质量的工具
  • 用Firebugdebugging大多数
  • 依靠gzip压缩来减less空间
  • 创build大量的小型模块化JS文件
  • 使用rails静态合并,并根据需要自动包含这些文件。 这是自定义代码,但我已经博客了。 这可以让你随着开发的不断增长而保持模块化
  • 构build相当多的jQuery插件来pipe理网站上的小部件

刚开始使用RubyMine作为JavaScript IDE,纯粹是为了支持JavaScript,这非常好。 这与IntelliJ IDEA中的相同。

对于debugging,Firebug是一个显而易见的必须具备的,虽然最近在我看来,它已经走下坡路了。 我倾向于使用日志logging而不是debugging器,所以我发现log4javascript非常有用(尽pipe我应该指出我写过它)。 我也偶尔使用WebKit的inspector thingy和IE 8的debugging器,以及Visual Studio的早期版本的IEdebugging器。

对于代码质量,我手动使用JSLint,偶尔也会不同意它的一些build议。 RubyMine / IntelliJ还拥有大量的JS“检查”,可以在您编写代码时分析代码,并在您的代码旁边生成警告,这对我来说很有用。

我倾向于在几个开发页面上开发,这些页面包括个别的,未定义的脚本,创build构build时,我运行构build脚本(我自己的,用Ant编写的),从版本控制中检查我的代码,连接各个脚本,debugging调用,缩小/压缩(使用JSMin或YUICompressor)代码,并运行unit testing。 我的unit testing脚本是我自己的,没有什么大的幻想。

它工作得相当好,但并不完美。

我还没有写任何大的Javascript(我的最新项目大约3000行),但我做JSLint我的代码,并将其与我的部署/生成脚本中所需的所有库缩小/组合。 我的构build脚本还改变了直接导入脚本和库的HTML,导入生产压缩的代码。 这样您就不必运行构build脚本来查看发展变化,这是必不可less的。

YUI Compressor非常慢,特别是在启动JVM运行的时候,却能完成工作。 部署脚本中的一些缩小对于摆脱所有注释是非常重要的,如果避免使用全局variables,那么也会得到一个有意义的标识符名称长度压缩,尽pipe在gzip之后没有多大的好处。 可能你会想要另一个步骤来删除console.debug行和其他debugging代码。

为了debugging,FireBug。 我确定webkitdebugging器也不错。

为了开发,vim改进了js缩进脚本和ctags以及一些js修改。 我不确定真正的IDE有什么优点,但我确定有一些。 Vim在默认情况下不会在JavaScriptstring中进行HTML的语法高亮显示,但显然它可以被configuration为 。

JSLint很容易在Rhino中运行,但是spidermonkey的速度要快3倍,因为它不需要启动JVM。 克罗克福德不支持这种安排,但我设法让它工作。

我在一个稍微不同的技术堆栈(asp.net mvc),但这里是:

  • IDE:Visual Studio 2008 + ReSharper,Asp.Net MVC
  • 编辑器:Notepad ++(我大部分时间都在VS中,但Notepad ++对JavaScript有更好的语法高亮)
  • 开发者浏览器:FireFox + Firebug + YSlow + PageSpeed + FireCookie同时添加开发者工具栏
  • 其他浏览器:IE8,Chrome 3,Safari,Opera(很less使用),IE6和IE7通过虚拟机(可从Microsoft下载的虚拟PC镜像)。
  • 后处理:JLint和YUI压缩器。 我有一个build立任务做YUI压缩机部分。
  • JavaScript框架:JQuery + JQuery UI
  • 其他的东西:JQueryvalidation,JSON2
  • 编辑器:记事本或任何其他语法高亮的文本编辑器

  • IDE:可以是Dreamweaver,Aptana,Netbeans – 根据您的个人喜好。

  • Javascript框架:我更习惯于jQuery,我仍然推荐jQuery。
    你可以看看为jQuery添加一些“插件”。 有些真的很酷。 像Facebox( http://famspam.com/facebox ) – 一个简单易用的jQuery Facebook式popup框。 或jQuery Cookie插件

  • debugging:Firebug(FireCookie,Page Speed,YSlow) – 没有与IDE集成,但在浏览器上是魔术。 如果你需要跨浏览器debugging,你可以去Firebug Lite。

    你可以很容易地使用console.log()来debugging,而不是alert(特别是当你用大量的callback函数,定时器,AJAX等来做JavaScript的时候,你不希望一个alert语句打破原来的方式。

  • 后期处理:Packer – http://dean.edwards.name/packer/

Google Wave是由GWT支持的,所以对于更大的应用程序来说,它似乎是一个不错的select。

我使用Dashcode来开发Mac Widgets,因为它是“好的”,并且有很多面向小部件的function,但对于其他所有function,TextMate

Web Tech已经走了一步,所以我想在2017年提到一些很好的现代工具和框架给任何人看到这个问题。

你使用什么编辑器和编辑器插件/模式/脚本?

Atom是我select的文本编辑器,因为我在MS生态系统中,Visual Studio 2013是我使用的IDE,尽pipe我避免了VS for JavaScript的开发。 尽pipe我可以尽我所能,只用Atom做几乎所有的JavaScript开发。

我有一个公平的插件,这有助于我的工作stream程。

  • primefaces美化 ,我用它来清理任何样式的问题,我可能会介绍,它在保存这样做,使我容易,因为我经常保存和检查。
  • atom-easy-jsdoc ,它允许我使用热键组合插入jsdoc注释,这非常棒,因为它让我自动生成代码文档,特别适用于API开发。
  • atom-ternjs是我用于JavaScript代码完成的包,我不经常需要这个,但它是方便的。
  • minimap是一个插件,允许我在特定文档中查看所有代码的低细节大纲,我发现它比滚动条更容易使用。 因人而异。
  • 颜料是一种插件,它在文本后面检测CSS中的hex颜色时呈现颜色。 如果您需要快速调整并查看结果,则此function非常有用。

你使用任何types的IDE(Aptana,Dashcode或类似的)?

往上看 :)

你使用的是什么JavaScript库或框架?

我倾向于使用RequireJS作为家庭项目,并在工作中使用内部模块加载器。 我一般不会在我的项目中使用库和框架,但是当我这样做的时候,我对AngularJS(1.x)非常偏爱。 这一切都取决于我在做什么。

你使用任何编译成JavaScript的语言(GWT,haxe,Objective-J)?

不。

你使用什么unit testing框架? 你如何援引他们? 他们可以从你的编辑器/ IDE,从命令行,浏览器的网页,从你的JavaScriptdebugging器?

我使用Karmatesting运行器的Node.js作为testing运行器(who'da Thunk它?), Jasmine作为我的testing框架, sinonJS作为testing开发的stubbing / mocking库。

Karma可以configuration为观察文件系统的变化(或者像文件监视插件那样的grunt任务运行)也可以在每次保存文件时执行我所有的testing。 它还能够同时运行多个浏览器的testing。 所以它会testingJS对IE,Edge,Chrome,Firefox,PhantomJS等…这是非常有用的。

我有我的js项目设置运行咕噜任务。 我通常只是从命令提示符/terminal执行“grunt devmode”,就是这样,我的testing运行。 对于提交时的持续集成,我有一个单独的grunt任务,只运行一次testing。 对于家庭使用我有TravisCI运行任何时候发生推。

你使用了什么其他的代码质量工具(JSlint,代码覆盖工具,或其他类似的东西)?

我使用JSHint,因为它比JSLint更挑剔。 对于代码覆盖范围,我使用伊斯坦布尔,随机运行,每当我的unit testing运行,这是超级有用的。

你在debugging环境中使用什么(Firebug,WebKit inspector等)? 它是否与您的编辑器或IDE有任何集成?

我使用任何一个Web浏览器都有问题。 如果是服务器端,例如Node,我可以使用节点debugging器,因为我可以直接从Atom进行debugging。

在部署代码(混淆器,缩小器,任何types的优化器)之前,您会对代码执行哪些后处理?

我通常不会这样做,这对于Web项目来说是理想的一个缩小器和uglifier。

你有什么样的工具来pipe理模块依赖关系,或者根据需要dynamic加载代码? 我正在编写的应用程序将使用大量的代码,并且我想保持加载时间的下降,所以跟踪需要什么模块或按需加载代码的工具将会有所帮助。

是的! 我使用RequireJS AMD实现。 我使用npm作为我select的包pipe理器,但是如果我使用Visual Studio,我将使用nuget。

在你的工具链中是否还有其他重要的工具(特定于基于浏览器的应用程序的JavaScript开发;我已经有了一个完美的版本控制系统,错误跟踪器等)?

不太清楚我是否理解这个问题,但我使用Git作为家庭项目,在工作中使用TFS,使用GitHub作为我的回购主机,使用TravisCI进行持续集成,使用Coveralls(Git存储库的代码覆盖记者)。