从最初的dreamweaver,到Notpad++,再到aptana,每一款IDE总让我我感觉少了点什么东西。WebStorm却让我眼前一亮,虽然公司项目所用的开发环境是eclipse+aptana(主要是方便团队协作和工程调试),但是其他时间我都会学习使用WebStorm,现在4.0版本已经出来了,让我们来看看它都有哪些强大之处吧:
浏览器支持细节提示
关键字,标签,变量,参数和功能的JavaScript代码完成是基于支持DOM的流行的浏览器(IE,火狐等)标准,可以显示在不同浏览器之下的支持细节。
智能的代码导航和搜索提示
ECMAScript的Harmony支持
WebStorm支持最新的ECMAScript版本,你可以尝试新的功能,每个JavaScript引擎的实现增加了别人所不具备的一些不错的功能,当您使用的目前选定的JavaScript版本不支持,WebStorm将通知您,并建议速战速决:
支持CoffeeScript
CoffeeScript是一种编程语言,编译JavaScript和增强其简洁性和可读性,同时还增加了一些复杂的功能,像阵列的理解和模式匹配。WebStorm提供您:
- 代码导航和完成
- 重命名重构
- 语法高亮
- 错误检查
- 查找使用实例
支持Node.js
WebStorm允许你调试和验证您的服务器端JavaScript – Node.js的应用。
编辑CommonJS的模块结构,并提出适当的自动完成选项:
JavaScript的重构
为JavaScript提供的重构功能,让您可以轻松地修改代码结构,以及撤消修改。
- 移动/复制
- 安全删除
- 提取到嵌入的脚本文件
- 重命名
- 提取变量/函数
- 内联变量/函数
JavaScript单元测试
如果你是一个JavaScript开发人员,你可能知道,您的应用程序的质量和正确性是至关重要的。那么,一致性测试和回归测试正好是你的痛苦少一点。支持JsTestDriver插件。
WebStorm为单元测试提供了一个清晰的画面。从现在开始,JsTestDriver用户可以测量代码覆盖率。
在IDE线行使你的单元测试:
你还可以看到文件和目录在项目视图的测试覆盖率统计:
代码检查和快速修复
为了确保更好的代码质量,WebStorm可以捕捉动态的JavaScript代码中的常见错误…
…,并为他们提供了快速修复。
支持JSLint / JSHint
JavaScript代码质量工具集成在IDE中。
基于Mozilla Firefox的JavaScript调试器
- HTML和JavaScript断点
- 定制断点属性:暂停模式,条件,通过计数
- 帧,变量和JavaScript调试器
- JavaScript表达式的运行评价
批量代码分析
无需通过点击所有文件或部署到服务器。整个源代码树的启动代码分析,可以在一个单一的视图中看到所有的结果。
语言混合编辑
支持任何代码中的“外部”和“内部”的语言 – 享受以外的JavaScript代码块,或在JavaScript字符串文字编码的CSS,HTML,SQL等。
拼写检查
集成拼写检查验证在标签的文本,代码串,评论,以避免您的网页上的拼写错误和错别字。以确保代码的可读性更好,甚至变量名,CSS类和ID拼写检查。
智能重复代码检测
支持HTML5
WebStorm也明白你的代码和每个元素的类型,并显示新的HTML5元素支持的方法:
只需按Ctrl +空格,WebStorm会显示所有可能的自动完成选项。
验证和快速修复
WebStorm可以修复检测下列问题,并给你更合理的建议建议:
- 无效的CSS选择器的格式
- 无效的CSS属性
- 未使用的CSS类定义
- 无效的本地锚和更多…
- 缺少必需的属性
- 无效的属性或非法值
- 错误的引用文件中的链接
- 重复的属性
每当你看到一个灯泡,打ALT +回车,看看WebStorm有什么建议:
支持Zen Coding
WebStorm内置了zen coding,可以使你编写代码更有效率。输入div.feature> H4 + P, 按 Tab ,你会得到
显示内容
鼠标移到HTML中的CSS选择器,可以立即显示这个选择器的实际的样式;引用调用一个图像文件的时,你会看到图片预览。
应用样式
此命令将打开的标签应用到通过CSS样式的树视图里的样式。
HTML5的样板和其他Web应用程序模板
当你创建一个新项目的时候,WebStorm提供一些知名的项目模板,根据自己的需要使用:
FTP和远程文件同步化
你可以使用简单的配置和直观的用户界面,从远程主机的FTP,或安装网络驱动器打开文件。
可以使用自动同步功能保存本地编辑项目文件和部署到远程服务器。
在Web服务器的配置标记的目录排除,包括从转让和设置索引|目录。
集成版本控制系统
WebStorm支持最流行的版本控制系统:
- Subversion
- Mercurial
- Git
- Perforce
- CVS
- TFS
至此,我们已经大概了解WebStorm提供的一些最令人兴奋的功能。但这些只是冰山的一角。如果想有更多体验,不放自己下载一试。
官方下载地址:
发表评论
-
基于脚本的动画的计时控制(“requestAnimationFrame”)(转载)
2014-03-04 19:12 950Internet Explorer 10 和使 ... -
IE11开发人员工具:UI响应工具详解
2014-02-27 18:33 891我讨厌debug,相信也没多少开发者会喜欢。但是当代码出 ... -
IE11开发人员工具:内存分析工具详解
2014-02-27 18:32 1381上篇我们跟大家介绍 ... -
E6与location.hash和Ajax历史记录 (转载)
2014-02-26 12:23 521为了在IE6中改变hash来保留历史记录实现ajax的前进 ... -
MIME Types(转载)
2013-12-31 10:20 605MIME Types - Complete List ... -
iframe历史记录问题(转载)
2013-10-17 10:21 1255在做页面统计的时候 ... -
前端类库精选(转)
2013-05-11 00:57 0优秀的前端类库,自己平时遇见了,这里Mark一下。 1、m ... -
10个chrome console实用小技巧(转)
2013-05-09 10:56 10271. 基本输出 让我们先从最常见的console.l ... -
CSS3那些不为人知的高级属性(转)
2013-04-19 13:35 904原文:CSS的未来:一些 ... -
JavaScript 时间、格式、转换及Date对象总结(转)
2013-04-10 14:49 685悲剧的遇到问题,从前台得到时间,“Tue Jan 29 16 ... -
如何制作一个可及性强(accessible)的网页弹框(转载)
2013-04-02 16:18 784英文原文:Making an accessib ... -
JavaScript MVC js也mvc(转载)
2013-03-16 23:59 667JavaScript MVC 中文:http://blog ... -
SUBLIME TEXT 2 设置文件详解
2012-12-27 11:21 1021Sublime Text 2是那种让人会一眼就爱上的编辑 ... -
两个按位非操作与Math.floor操作(译)
2012-12-10 18:17 921位操作符在我们编码过程中是容易被遗忘的,可能更多的源于我们 ... -
img中src为空的影响
2012-11-26 23:32 0这是我们经常能遇到的代码,可以直接用html标签或者Java ... -
IE6下position定位子元素溢出,父元素被撑开的解决思路。(转)
2012-11-13 18:04 1608在一些被常规的页面布局当中,我们常常需要通过positi ... -
chrome developer tool 调试技巧(转)
2012-11-12 13:16 816这篇文章是根据目前 chrome 稳定版(19.0.10 ... -
你清楚jquery是如何清除ajax缓存的吗?(转)
2012-11-11 11:19 1028大家都知道万恶的IE在ajax中往往只读取第一次ajax ... -
是时候使用JavaScript严谨模式(Strict Mode)提升团队开发效率 In JavaScript(转)
2012-11-10 23:33 688随着WebApp突飞猛进的发展,Javascript写的 ... -
Javascript基础
2012-11-10 23:25 0原文:http://bonsaiden.githu ...
相关推荐
前端开发IDE、JS神器WebStorm5教程
前端开发IDE、JS神器WebStorm5教程------免费下载.pdf
WebStorm却让我眼前一亮,虽然公司项目所用的开发环境是eclipse+aptana(主要是方便团队协作和工程调试),但是其他时间我都会学习使用WebStorm。WebStorm有什么功能?下面我把WebStorm的功能大致罗列一下(这里只说...
webstorm:Webstorm配置
WebStorm 是一款JavaScript 开发工具,被JS开发者誉为Web前端开发神器、最强大的HTML5编辑器、最智能的JavaScript IDE。
测试网络风暴测试 IDE Webstorm
APICloud开发工具:WebStorm插件
JetBrains IDE Support 是一款谷歌浏览器上进行开发调试用的插件。支持HTML/CSS/JavaScript编辑和 JavaScript 调试。
nodejs-webstorm Adron Hall关于WebStorm中Node.js开发工作流程的网络研讨会
webstorm中px转rem插件 使用说明: 1.file-settings-plugins-install plugin from disk-选择生成的jar文件-restart webstorm 2.tools-SetPX2REM设置计算的比值-选中代码段,如'100px'-后,点击shift+f 3.设置界面和...
概述 该项目是运行的简单Docker映像。 先决条件 工作的引擎 正常工作的安装 建造 键入docker-compose build生成镜像。 安装 Docker将自动将新构建的映像安装到缓存中。...docker-compose up将启动映像,使您可以开始...
下边我们介绍下webstorm来开发微信小程序的一些配置: 1.首先FileType下Cascading Style Sheet 添加*.wxss (此图片来源于网络,如有侵权,请联系删除! ) 2.FileType下HTML 添加*.wxml (此图片来源于网络,如有...
WebStorm Workflow for Alfred 简介 WebStorm 工作流 for Alfred WebStorm -> Tools -> Create Command-line Launcher 添加 /usr/local/bin/wstorm 命令 先添加 workspace,再使用 用法: 打开操作 ws query 通过 ...
webstorm是非常流行的前端开发IDE 而minify html压缩html代码也是前端必备技能之一 如何让webstorm存盘html文件时,自动压缩html文件?我一步一步教你
在WebStorm中调试ES6 简短的提醒自己如何在ES6的WebStorm中进行调试。 如果它也对您有帮助,那就太好了! ;-) 使用的文件夹结构: root|-- src |-- index.js |-- sample.js.babelrcgulpfile.babel.jspackage.json....
09前端开发基础视频-webstorm的使用和三个开发工具的选择.avi 06前端开发基础视频-sublime3安装和包管理器安装.avi 07前端开发基础视频-sublime3包管理器安装.avi 11前端开发基础视频-什么是浏览器什么是服务器...
WebStorm是一款优秀的JavascriptIDE,在本文中将简要介绍一下WebStorm的用户界面,帮助用户通过自己的工作环境找到合适的工作方式。有需要的朋友可以下载看看 资源太大,传百度网盘了,链接在附件中,有...
Alfred在WebStorm中打开 Alfred 4工作流程在WebStorm中打开。 特征 搜索项目并在WebStorm中打开。 搜索项目并在Finder中显示。 在WebStorm中打开选定的文件。 模糊搜索。 安装 npm i -g alfred-open-in-webstorm...