论坛首页 Web前端技术论坛

对于JavaScript 个各位用的是什么开发环境?Webstorm怎么样

浏览 16426 次
精华帖 (0) :: 良好帖 (1) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2013-07-07  
kidneyball 写道
kidneyball 写道
witcheryne 写道
kidneyball 写道
witcheryne 写道
给楼主一个传送门:
http://witcheryne.iteye.com/blog/585226
以前整理的文章。
Eclipse + Aptana Studio 够用了。
WebStorm 收费的吧. 好像是 windows only


话说我的WebStorm是去年底他们搞世界末日前夕二五折大酬宾时入的。减价两天前才全价升级了Intellij IDEA 12,真是气死。

有Windows,Linux,Mac三个版

哈哈!
抓了WebStorm,很赚了!  这个99美刀吧...
IDEA 199美刀!霸气!有什么很吸引人的特性么?



最吸引的就是流畅,打开两三万行的js文件没有卡顿现象,函数定位和智能提示也很准确,html内嵌script和js文件之间的跳转和提示,使用了AMD (requireJS) 情况下的跳转和提示都没问题。eclipse插件装多了很容易卡,而inteillij基本没有发现这个问题。如果做纯客户端开发,还有宽屏之友LiveEdit, 演示视频: http://www.youtube.com/watch?feature=player_embedded&v=sa4jP9NJCeE (youtube地址,需FQ)(可惜只支持chrome,但调试我个人习惯在firefox下用firebug来搞,因此比较麻烦)

与纯字处理软件(带ctag功能)相比,最重要的优势是重构和inspection (开发期的即时代码质量改进提示),例如你在同一个函数里多次用了同一个jQuery Selector,它会提示你可以抽取为一个局部变量提高效率,并且你只需要在提示处按alt-enter它就能自动帮你重构好。


好吧,为了方便墙内朋友,我把WS6 的 LiveEdit演示视频转到 http://video.sina.com.cn/v/b/109112650-1405299693.html 了。但这一版的演示视频没有直接用html+css+js,而是用了jade (http://jade-lang.com/) +sass (http://sass-lang.com/)+coffiescript (http://coffeescript.org/),用js的情况大致相同。这一版还对这三种语言做了个即时编译。另外演示中使用了 angularJS ( http://angularjs.org/ ) 这个客户端MVC框架。留意屏幕右边是个chrome,你在WS里敲代码,chrome就会自动刷新进行预览。


震惊了!非常强大,调色板,liveedit很吸引人。
eclipse经常卡,已经受不了了。平时改简单的功能直接上TextMate + Ant。
前段时间用gvim做了一个前端的project,用的backbone + requirejs + jasmine,现在回想起来,用vim简直是自虐。
项目地址放出来,有兴趣可以看看:
https://github.com/lvjian700/formdesigner

WebStrome明天到公司研究研究。


0 请登录后投票
   发表时间:2013-07-08   最后修改:2013-07-08
Eclipse就行了,我没做过大项目,小项目还是没问题的。
0 请登录后投票
   发表时间:2013-07-08  
微软的express免费软件
0 请登录后投票
   发表时间:2013-07-08  
kidneyball 写道
kidneyball 写道
witcheryne 写道
kidneyball 写道
witcheryne 写道
给楼主一个传送门:
http://witcheryne.iteye.com/blog/585226
以前整理的文章。
Eclipse + Aptana Studio 够用了。
WebStorm 收费的吧. 好像是 windows only


话说我的WebStorm是去年底他们搞世界末日前夕二五折大酬宾时入的。减价两天前才全价升级了Intellij IDEA 12,真是气死。

有Windows,Linux,Mac三个版

哈哈!
抓了WebStorm,很赚了!  这个99美刀吧...
IDEA 199美刀!霸气!有什么很吸引人的特性么?



最吸引的就是流畅,打开两三万行的js文件没有卡顿现象,函数定位和智能提示也很准确,html内嵌script和js文件之间的跳转和提示,使用了AMD (requireJS) 情况下的跳转和提示都没问题。eclipse插件装多了很容易卡,而inteillij基本没有发现这个问题。如果做纯客户端开发,还有宽屏之友LiveEdit, 演示视频: http://www.youtube.com/watch?feature=player_embedded&v=sa4jP9NJCeE (youtube地址,需FQ)(可惜只支持chrome,但调试我个人习惯在firefox下用firebug来搞,因此比较麻烦)

与纯字处理软件(带ctag功能)相比,最重要的优势是重构和inspection (开发期的即时代码质量改进提示),例如你在同一个函数里多次用了同一个jQuery Selector,它会提示你可以抽取为一个局部变量提高效率,并且你只需要在提示处按alt-enter它就能自动帮你重构好。


好吧,为了方便墙内朋友,我把WS6 的 LiveEdit演示视频转到 http://video.sina.com.cn/v/b/109112650-1405299693.html 了。但这一版的演示视频没有直接用html+css+js,而是用了jade (http://jade-lang.com/) +sass (http://sass-lang.com/)+coffiescript (http://coffeescript.org/),用js的情况大致相同。这一版还对这三种语言做了个即时编译。另外演示中使用了 angularJS ( http://angularjs.org/ ) 这个客户端MVC框架。留意屏幕右边是个chrome,你在WS里敲代码,chrome就会自动刷新进行预览。



Live Edit 有用过么?  从服务访问的页面怎么做live edit ?
RequireJS 模块跳转是不是需要 plugins 支持?


0 请登录后投票
   发表时间:2013-07-08   最后修改:2013-07-08
witcheryne 写道
kidneyball 写道
kidneyball 写道
witcheryne 写道
kidneyball 写道
witcheryne 写道
给楼主一个传送门:
http://witcheryne.iteye.com/blog/585226
以前整理的文章。
Eclipse + Aptana Studio 够用了。
WebStorm 收费的吧. 好像是 windows only


话说我的WebStorm是去年底他们搞世界末日前夕二五折大酬宾时入的。减价两天前才全价升级了Intellij IDEA 12,真是气死。

有Windows,Linux,Mac三个版

哈哈!
抓了WebStorm,很赚了!  这个99美刀吧...
IDEA 199美刀!霸气!有什么很吸引人的特性么?



最吸引的就是流畅,打开两三万行的js文件没有卡顿现象,函数定位和智能提示也很准确,html内嵌script和js文件之间的跳转和提示,使用了AMD (requireJS) 情况下的跳转和提示都没问题。eclipse插件装多了很容易卡,而inteillij基本没有发现这个问题。如果做纯客户端开发,还有宽屏之友LiveEdit, 演示视频: http://www.youtube.com/watch?feature=player_embedded&v=sa4jP9NJCeE (youtube地址,需FQ)(可惜只支持chrome,但调试我个人习惯在firefox下用firebug来搞,因此比较麻烦)

与纯字处理软件(带ctag功能)相比,最重要的优势是重构和inspection (开发期的即时代码质量改进提示),例如你在同一个函数里多次用了同一个jQuery Selector,它会提示你可以抽取为一个局部变量提高效率,并且你只需要在提示处按alt-enter它就能自动帮你重构好。


好吧,为了方便墙内朋友,我把WS6 的 LiveEdit演示视频转到 http://video.sina.com.cn/v/b/109112650-1405299693.html 了。但这一版的演示视频没有直接用html+css+js,而是用了jade (http://jade-lang.com/) +sass (http://sass-lang.com/)+coffiescript (http://coffeescript.org/),用js的情况大致相同。这一版还对这三种语言做了个即时编译。另外演示中使用了 angularJS ( http://angularjs.org/ ) 这个客户端MVC框架。留意屏幕右边是个chrome,你在WS里敲代码,chrome就会自动刷新进行预览。



Live Edit 有用过么?  从服务访问的页面怎么做live edit ?
RequireJS 模块跳转是不是需要 plugins 支持?




目前我只在用客户端MVC配restful服务返回json时用live edit。我现在公司的主项目是jsf的,页面和响应代码不同步,做纯服务端项目时用不了live edit。如果是普通的服务端,可以试试在debug configuration那里配好服务器,从intellij内部启动服务器进行客户端调试。

RequireJs我好像没特别装插件就能用呀,明天回公司确认一下。例如在require(['模块名称'], function...) 的模块名称上按gd (装了vim插件)就能直接跳到对应的js文件。
0 请登录后投票
   发表时间:2013-07-08  
kidneyball 写道
witcheryne 写道

好吧,为了方便墙内朋友,我把WS6 的 LiveEdit演示视频转到 http://video.sina.com.cn/v/b/109112650-1405299693.html 了。但这一版的演示视频没有直接用html+css+js,而是用了jade (http://jade-lang.com/) +sass (http://sass-lang.com/)+coffiescript (http://coffeescript.org/),用js的情况大致相同。这一版还对这三种语言做了个即时编译。另外演示中使用了 angularJS ( http://angularjs.org/ ) 这个客户端MVC框架。留意屏幕右边是个chrome,你在WS里敲代码,chrome就会自动刷新进行预览。


Live Edit 有用过么?  从服务访问的页面怎么做live edit ?
RequireJS 模块跳转是不是需要 plugins 支持?




目前我只在用客户端MVC配restful服务返回json时用live edit。我现在公司的主项目是jsf的,页面和响应代码不同步,做纯服务端项目时用不了live edit。如果是普通的服务端,可以试试在debug configuration那里配好服务器,从intellij内部启动服务器进行客户端调试。

RequireJs我好像没特别装插件就能用呀,明天回公司确认一下。例如在require(['模块名称'], function...) 的模块名称上按gd (装了vim插件)就能直接跳到对应的js文件。

Live Edit 在 server 环境下好像不好做。 我的server是内嵌的jetty。平时开ruby开发. 在edit configuration中都没找到这两个运行环境。

require js我试了, 装了vim插件,gd直接到定义。 我在requirejs中对folder做了alias,使用alias路径不能跳转。
刚试了试,几个功能很棒:
1. vim插件在webstorm下运行神速
2. html编辑器有xpath导航,比outline这种东西直观很多.
3. 支持textmate tab -> template 这点很棒。

最近在做ipad项目,前端做的不多,以后这方面有瓶颈了,可以搞一个.. 现在个人版好像45美刀.   
0 请登录后投票
   发表时间:2013-07-09  
witcheryne 写道
kidneyball 写道
witcheryne 写道

好吧,为了方便墙内朋友,我把WS6 的 LiveEdit演示视频转到 http://video.sina.com.cn/v/b/109112650-1405299693.html 了。但这一版的演示视频没有直接用html+css+js,而是用了jade (http://jade-lang.com/) +sass (http://sass-lang.com/)+coffiescript (http://coffeescript.org/),用js的情况大致相同。这一版还对这三种语言做了个即时编译。另外演示中使用了 angularJS ( http://angularjs.org/ ) 这个客户端MVC框架。留意屏幕右边是个chrome,你在WS里敲代码,chrome就会自动刷新进行预览。


Live Edit 有用过么?  从服务访问的页面怎么做live edit ?
RequireJS 模块跳转是不是需要 plugins 支持?




目前我只在用客户端MVC配restful服务返回json时用live edit。我现在公司的主项目是jsf的,页面和响应代码不同步,做纯服务端项目时用不了live edit。如果是普通的服务端,可以试试在debug configuration那里配好服务器,从intellij内部启动服务器进行客户端调试。

RequireJs我好像没特别装插件就能用呀,明天回公司确认一下。例如在require(['模块名称'], function...) 的模块名称上按gd (装了vim插件)就能直接跳到对应的js文件。

Live Edit 在 server 环境下好像不好做。 我的server是内嵌的jetty。平时开ruby开发. 在edit configuration中都没找到这两个运行环境。

require js我试了, 装了vim插件,gd直接到定义。 我在requirejs中对folder做了alias,使用alias路径不能跳转。
刚试了试,几个功能很棒:
1. vim插件在webstorm下运行神速
2. html编辑器有xpath导航,比outline这种东西直观很多.
3. 支持textmate tab -> template 这点很棒。

最近在做ipad项目,前端做的不多,以后这方面有瓶颈了,可以搞一个.. 现在个人版好像45美刀.   


我又想了一下,Live Edit应该是不支持服务器端的。你留意一下,Live Edit生效时不会导致整个页面刷新。Intellij应该是通过chrome插件把DOM树结构跟正在编辑文件的语法树结构挂钩来实现局部刷新。这个动作如果要在编辑过程中实时对服务器的响应流来做,估计性能跟不上,理论上也很难分离出改动部分。

对于服务器上的项目,其实我们通常只需要一个全局的浏览器刷新热键,省下先激活浏览器,再按F5,再回到IDE这套步骤。我实际工作中是用AutoHotKey来实现的 (只支持Windows,Mac下估计有类似的软件)。下面是我常用的AutoHotKey脚本:

#NoEnv  ; Recommended for performance and compatibility with future AutoHotkey releases.
SendMode Input  ; Recommended for new scripts due to its superior speed and reliability.
SetWorkingDir %A_ScriptDir%  ; Ensures a consistent starting directory.
SetTitleMatchMode RegEx


;===========================
;Helpper Functions
;===========================
GUID()         ; 32 hex digits = 128-bit Globally Unique ID
{
VarSetCapacity(bGuid, 16,0)
VarSetCapacity(sGuid, 76)

dllcall("ole32.dll\CoCreateGuid", uint,  &bGuid)
x := dllcall("ole32.dll\StringFromGUID2", "uint", &bGuid, "str", sGuid, "int", 76)

Loop 76
 UUID .= (Mod(A_Index,2) = 1) ? Chr( *(&sGuid+(A_Index-1)) ) : ""
return UUID
}

;===========================
;Programming Settings
;===========================

::]date::  ; 输入]date自动转为当前时间 (用于调试时加入临时标记)
FormatTime, CurrentDateTime,, M/d/yyyy h:mm:ss tt  ; It will look like 9/1/2005 3:53 PM
SendInput %CurrentDateTime%
return

::]rand::  ; 输入]rand自动转为随机数
Random rand,0,99999999999999
SendInput %rand%
return

::]guid::  ; ; 输入]guid自动在当前位置插入一个GUID
x := GUID()
SendRaw % x
return

!F5::  ; Alt+f5 Open a node script console.
Run node
return

!F6::  ; Alt+f6 open a scala script console.
Run scala
return

!F7::  ; Alt+f7 open a irb console.
Run irb
return

^!r::  ; Ctrl+Alt+R 刷新FireFox
; Save current window
WinGet, original, , A

; ---------------------------------------
; Refresh Firefox
Process, Exist, firefox.exe
    If(ErrorLevel) {
        WinActivate, ahk_pid %ErrorLevel%
        Send {F5}
    }

; Refresh Chrome
;Process, Exist, chrome.exe
;    If(ErrorLevel) {
;        WinActivate, ahk_pid %ErrorLevel%
;        Send {F5}
;    }

; Refresh Internet Explorer
;Process, Exist, iexplore.exe
;    If(ErrorLevel) {
;        WinActivate, ahk_pid %ErrorLevel%
;        Send {F5}
;    }

; ---------------------------------------
; Return to original window
WinActivate ahk_id %original%
return



在任何地方按Ctrl+Alt+R都可以刷新FireFox并跳回当前窗口
0 请登录后投票
   发表时间:2013-07-09  
kidneyball 写道


我又想了一下,Live Edit应该是不支持服务器端的。你留意一下

在任何地方按Ctrl+Alt+R都可以刷新FireFox并跳回当前窗口

AutoHotKey mac下估计不好用。
TextMate 提供 Command + R 刷新当前浏览器功能。AppleScript 也应该能搞定这事情。

P.S:
今天试了试IDEA,有种中毒的感觉.
免费版好像也够用 。







0 请登录后投票
   发表时间:2013-07-11  
WebStorm 6下载  http://software.evget.com/Products/2997/download.html
0 请登录后投票
   发表时间:2013-07-11  
witcheryne 写道
给楼主一个传送门:
http://witcheryne.iteye.com/blog/585226
以前整理的文章。
Eclipse + Aptana Studio 够用了。
WebStorm 收费的吧. 好像是 windows only

嗯,但是貌似对新的技术支持比较快哦·····内置了对 SASS、NodeJS、CoffeeScript 的支持,试用了一下,智能···

 

0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics