WebStorm mac版是一款运行在Mac平台上的JavaScript开发工具,也被人称为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。其与IntelliJ IDEA同源,并继承了IntelliJ IDEA强大的JS部分的功能。webstorm mac有着智能代码补全功能,支持不同浏览器的提示,并包括所有用户自定义的函数,且代码补全库中包含了目前所有流行的库,包括JQuery、YUI、Dojo、Prototype和Mootools and Bindows等。同时它还具有代码格式化、html提示、联想查询、代码重构、代码调试和代码结构浏览等优势功能。webstorm mac除了正常的JavaScript开发之外,还具有批量代码分析、编码语言混合或内混、拼写检查器和重复代码检测器等用途。新版全面支持AngularJS,其对流行框架提供高级支持,可智能提示AngularJS指令、controller和application names以及花括号里边的数据绑定。此外,新版还全面支持Spy-js、多个插入符和选择,并新增Grunt控制台和Live控制台等。有需要的朋友快来下载体验吧!
JetBrains WebStorm for mac官方版介绍
一、智能的代码补全
1.支持不同浏览器的提示,还包括所有用户自定义的函数(项目中)
2.代码补全包含了所有流行的库,比如:JQuery, YUI, Dojo, Prototype, Mootools and Bindows。
二、代码格式化
代码不仅可以格式化,而且所有规则都可以自己来定义
三、html提示
大家经常在js代码中编写html代码,一般来说十分痛苦,不过有了智能提示,就爽多了。而且html里面还能有js提示。
四、联想查询
只需要按着Ctrl键点击函数或者变量等,就能直接跳转到定义;可以全代码导航和用法查询项目查找函数或者变量,还可以查找使用并高亮。
五、代码重构
这个操作有些像Resharper,熟悉Resharper的用户应该上手很快,支持的有重命名、提取变量/函数、内联变量/函数、移动/复制、安全删除等等。
六、代码检查和快速修复
可以快速找到代码中的错误或者需要优化的地方,并给出修改意见,快速修复。
七、代码调试
支持代码调试,界面和IDEA相似,非常方便。
八、代码结构浏览
可以快速浏览和定位
九、代码折叠
功能虽小,不过胜在方便高效
十、包裹或者去掉外围代码
自动提示包裹或者去掉外围代码,一键搞定
webstorm mac使用技巧
1、收藏夹功能
当工程目录很庞大时,有些子目录很经常打开,但层级又很深,这时候可以把目录添加到收藏夹里面,添加成功后,左侧有个“Favorites”菜单
2、面包屑导航
除了左侧的工程页面,可以选择目录之外,在顶部菜单下有一个类似网站面包屑导航一样的目录也可以实现相同功。点击每个目录就会有下拉菜单显示其下的子目录,很实用.
3、构造器界面
注释符合格式的话就会出现。如果是js文件则是js类的函数和对象;css文件的话则是这个css文件的概括;html文件的话则是节点的结构图。话说这几个就是为了方便查看代码的结构性
4、todo界面
给代码加todo注释就会出现这个界面
5、双栏代码界面
右击代码选项卡上的文件,然后右键 - spilt vertically(左右两屏)或者spilt horizontally(上下两屏)
6、本地历史功能
找回代码的好办法
webstorm mac新功能
1、支持AngularJS
对流行框架提供高级支持。智能提示AngularJS指令(包括自定义指令),controller 和 application names以及花括号里边的数据绑定
2、支持Spy-js
JavaScript追踪变得简单。通过Spy-js你可以看到触发代码执行的事件的完整列表,然后帮你整理堆栈跟踪事件,并在源代码中突出显示
3、支持多个插入符和选择
现在WebStorm允许你把插入符放到多个位置,在这些位置你可以同时编辑代码,轻松地完成编辑和更换
4、内置Grunt控制台
通过Grunt控制台可以列出并定义grunt任务的完整列表, 双击可执行
5、集成Bower
集成Bower包管理器后,你可以更简单方便的在IDE中搜索、安装和管理客户端库和框架
6、JavaScript模块化
完善了对RequireJS和AMD的支持程度,基于requirejs.config实现了源码导航功能。并改善了对Harmony module loader的支持
7、Live控制台
在控制台中的JavaScript和Node.js的调试工具窗口现在可以作为一个shell提示符,并允许您执行命令和JavaScript代码
8、新增CucumberJS支持
WebStorm现在了解CucumberJS的语法,可以帮助您生成代码步骤定义。您可以在一个单一的点击开始测试,看到一个不错的结构化格式的测试结果,并轻松导航到测试源
webstorm mac用途
一、JavaScript
1.基于DOM,特定浏览器完成
2.编码导航和用法查询
3.支持ECMAScript
4.支持CoffeeScript
5.支持结点
6.JavaScript重构
7.JavaScript单元测试
8.代码检测和快速修复
9.JSLint/JSHint
10.基于 Mozilla的JavaScript调试器
二、其他用途
1.批量代码分析
2.编码语言混合或内混
3.拼写检查器
4.重复代码检测器
三、编辑语言
1.支持HTML5
2.css/js
3.检验和快速修复
4.Zen编码
5.显示内容
6.显示应用的风格
四、便捷的环境
1.HTML5样本文件和其他Web应用程序模板
2.FTP和远程文件同步
3.集成了版本控制系统
4.本地记录
webstorm mac快捷键大全
一、编辑
Command+alt+T 用 (if..else, try..catch, for, etc.)包住
Command+/ 注释/取消注释的行注释
Command+alt+/ 注释/取消注释与块注释
alt+↑ 向上选取代码块
alt+↓ 向下选取代码块
Command+alt+L 格式化代码
tab,shift+tab 调整缩进
Control+alt+I 快速调整缩进
Command+C 复制
Command+X 剪切
Command+V 粘贴
Command+shift+V 从剪贴板里选择粘贴
Command+D 复制代码副本
Command+delete 删除当前行
Control+Shift+J 清除缩进变成单行
shift+回车 快速换行
Command+回车 换行光标还在原先位置
Command+shift+U 大小写转换
Command+shift+[,Command+shift+] 文件选项卡快速切换
Command+加号,Command+减号 收缩代码块
Command+shift+加号,Command+shift+减号 收缩整个文档的代码块
Command+W 关闭当前文件选项卡
alt+单击 光标在多处定位
Control+shift+J 把下面行的缩进收上来
shift + F6 高级修改,可快速修改光标所在的标签、变量、函数等
alt+/ 代码补全
二、调试
Control+alt+R 运行项目
Command+Control+R 运行Debug
Command+F8 添加断点
Command+shift+F8 打开断点列表
三、导航
Command+O 跳转到某个类
Command+shift+O 跳转到某个文件
Command+alt+O 跳转到某个符号
Control+←,Control+→ 转到上/下一个编辑器选项卡
F12 打开之前打开的工具窗口(TODO、终端等)
Command+L 跳转行
Command+E 弹出最近文件
Command+alt+←,Command+alt+→ 向前向后导航到代码块交接处(一般是空行处)
Command+shift+delete 导航到上一个编辑位置的位置
Command+B 跳转到变量声明处
Control+J 获取变量相关信息(类型、注释等,注释是拿上一行的注释)
Command+Y 小浮窗显示变量声明时的行
Command+[,Command+] 光标现在的位置和之前的位置切换
Command+F12 文件结构弹出式菜单
alt+H 类的层次结构
F2,shift+F2 切换到上\下一个突出错误的位置
Command+↑ 跳转到导航栏
F3 添加书签
alt+F3 添加带助记的书签
alt+1,alt+2… 切换到相应助记的书签位置
Command+F3 打开书签列表
四、VCS/本地历史记录
control+V 打开VST小浮窗
Command+K 提交项目
Command+T 更新项目
alt+shift+C 打开最近修改列表
五、搜索和替换
Command+F 搜索
Command+R 替换
Command+G 查找下一个
Command+shift+G 查找下一个
Command+shift+F 按路径搜索
Command+shift+R 按路径替换
六、选中文字的搜索
Command+F7 向声明的地方搜索并选中
Command+shift+F7 打开搜索框进行搜索
Command+alt+F7 打开小浮窗显示搜索列表
七、对项目文件的操作(重构)
F5 复制文件到某个目录
F6 移动文件到某个目录
Command+delete 安全删除
shift+F6 重命名
八、全局
双击shift 弹出小浮窗搜索所有
Command+切换项目 Command+shift+ 反向切换项目
Command+shift+A 整个工程的查找操作
Command+1,Command+2… 打开各种工具窗口
alt+shift+F 把文件添加到收藏夹
alt+shift+I 打开项目描述
alt+~ 快速切换当前计划
Command+, 设置编辑器
Control+Tab 选项卡和工具窗口之间进行切换
alert+回车 显示npm版本升级列表
webstorm mac常见问题
1、如何更改主题(字体&配色)
File - settings - Editor - colors&fonts - scheme name
2、如何让webstorm启动的时候不打开工程文件
File - Settings-General去掉Reopen last project on startup
3、如何完美显示中文
File - Settings-Appearance中勾选Override default fonts by (not recommended),设置Name:NSimSun,Size:12
4、如何显示行号
File - Settings-Editor,”Show numbers”打上勾,就显示行号了
5、如何代码自动换行
File - settings - Editor “Use Soft Wraps in editor” 打上钩,代码就自动换行了
6、如何点击光标,显示在本行末尾
File - Settings-Editor “Allow placement of caret after end of ”去掉勾就行了。
7、如何修改快键键
File - Settings-Keymap,然后双击要修改快捷的功能会有提示框出来,按提示操作
8、换成自己熟悉编辑器的快键键
File -Settings-Keymap,支持像Visual Studio、Eclipse、NetBeans这样的主流IDE。
9、javascript类库提示
File - settings - Javascript - Libraries - 然后在列表里选择自己经常用到的javascript类库,最后Download and Install就ok了.
10、在开发js时发现,需要ctrl + return 才能选候选项
File - Setting - Editor - Code Completion - Preselect the first suggestion: “Smart” 改为 “Always”
11、js提示比较迟缓
File - Code Completion - Autopopup in 下 1000改为0
12、git配置
File - settings - Editor - github,进去改github的账户,如果没有git则不需要
13、插件安装
File -plugins,然后就选择给力的插件们再安装.(“css-X-fire”插件,用于当使用firebug修改css属性时,编辑器内的css代码也会发生变化)
系统要求
macOS 10.14 或更高版本
最低 2 GB 可用 RAM,推荐 8 GB 系统总 RAM
2.5 GB 硬盘空间,推荐 SSD
最低屏幕分辨率 1024x768