大家好,又见面了,我是你们的朋友全栈君。
WebStorm
- 任何一个编辑器都需要保存(ctrl + s),这是所有win平台上编辑类软件的特点,但是webstorm编辑文件右上角是没有那个熟悉的 * 的。
好处:省去了ctrl + s之后,在结合Firefox的vim,基本不动鼠标就可以看到结果页面了。
坏处:没有以前的 * 标识,万一键盘误操作也会被立即存储。
- 任何一个编辑器只要文件关闭了就没有历史记录了,但是webstorm有。 vcs->Local History -> Show History(快捷键:ALT+~ -〉7)
好处:只要webstorm不关闭,你的文件随时可以返回到之前的操作(这也是为啥在 webstorm 里ctrl+y是删除一行的原因了)。
坏处:webstorm关闭重启后这些历史记录就没有了;还有一个坏处就是由此带来的内存消耗也必然比较大。
- 任何一个编辑器,除了服务器svn之外,没有本地版本,但是webstorm提供一个本地文件修改历史记录(快捷键:ALT+SHIFT+c,Mac中 ALT+Option+c)。也可以 Ctrl + E 弹出最近打开的文件。
好处:相当于本地svn。
坏处:内存消耗也必然比较大。
- 集成了zencoding,HTML5,ftp,即时编辑(chrome),自动完成,基于Mozilla的JavaScript调试器,JSLint、Less支持、CoffeeScript支持、Node.js、单元测试、集成Git和svn版本控制等特性。
- 在编写CSS中,会智能的提示各种文件以及图片的路径,就不用再去确认这个文件是否存在了。
其他的特性就介绍了,想了解更多可以去
webstrom官网
继续寻找。看完了这么介绍以及那么多给力的特性,是不是有种冲动马上试一试这款传说中的前端神器啊?嗯。
首先在
官方下载页
下载webstrom后,点击安装,然后一直下一步,最后会出现需要注册码界面,因为webstrom是商业的IDE,而天朝的屌丝前端当然没那么钱去买那么昂贵的神器了,不用担心,我们可以用
WebStorm的密钥
来学习使用这款前端神器。嘿嘿~~~~
安装成功后,肯定会有些不适,就像我一样觉得这配色真的太戳了。还有一些设置也不是我也要的。那么以下我就列出我习惯的设置。
webstorm设置技巧
File -> settings -> Editor -> colors&fonts -> scheme name.
主题下载地址
File -> Settings->General去掉Reopen last project on startup.
File -> Settings->Appearance中勾选Override default fonts by (not recommended),设置Name:NSimSun,Size:12
File -> Settings->Editor,”Show line numbers”打上勾,就显示行号了
File -> settings -> Editor “Use Soft Wraps in editor” 打上钩,代码就自动换行了
File -> Settings->Editor “Allow placement of caret after end of line”去掉勾就行了。
File -> Settings->Keymap,然后双击要修改快捷的功能会有提示框出来,按提示操作
File ->Settings->Keymap,支持像Visual Studio、Eclipse、NetBeans这样的主流IDE。
File -> settings -> Javascript -> Libraries -> 然后在列表里选择自己经常用到的javascript类库,最后Download and Install就ok了.
- 在开发js时发现,需要ctrl + return 才能选候选项:
File -> Setting -> Editor -> Code Completion -> Preselect the first suggestion: “Smart” 改为 “Always”
File -> Code Completion -> Autopopup in 下 1000改为0
File -> settings -> Editor -> github,进去改github的账户,如果没有git则不需要.
File ->plugins,然后就选择给力的插件们再安装.(“css-X-fire”插件,用于当使用firebug修改css属性时,编辑器内的css代码也会发生变化。)
webstorm使用心得
当工程目录很庞大时,有些子目录很经常打开,但层级又很深,这时候可以把目录添加到收藏夹里面,添加成功后,左侧有个“Favorites”菜单
除了左侧的工程页面,可以选择目录之外,在顶部菜单下有一个类似网站面包屑导航一样的目录也可以实现相同功。点击每个目录就会有下拉菜单显示其下的子目录,很实用.
注释符合格式的话就会出现。如果是js文件则是js类的函数和对象;css文件的话则是这个css文件的概括;html文件的话则是节点的结构图。话说这几个就是为了方便查看代码的结构性.
给代码加todo注释就会出现这个界面
右击代码选项卡上的文件,然后右键 -> spilt vertically(左右两屏)或者spilt horizontally(上下两屏)
找回代码的好办法
WebStorm集成git使用
webstorm中只集成了git的常用操作,并不能完全替代命令行工具。在界面的右下角可以查看处于哪个git分支。也可以在上面点击切换或者新建分支。
右击代码界面任意区域,选择git -> compare with然后选择要比较的版本库。
webstorm快捷键说明
Editing
编辑相关快捷键
Basic code completion (the name of any class, method or variable) 基本代码完成(任何类、函数或者变量名称),改为Alt+S
Complete statement 补全当前语句
Parameter info (within method call arguments) 参数信息 包括方法调用参数
Brief Info 简单信息
Show description of error or warning at caret 显示光标所在位置的错误信息或者警告信息
Generate code…(Getters, Setters, Constructors)新建一个文件或者生成代码,…构造函数,可以创建类里面任何字段的getter与setter方法
Override methods 重载方法
Implement methods 实现方法
Surround with…(if, else, try, catch, for, etc)用 * 来围绕选中的代码行,( * 包括 if 、 while 、 try catch 等)
Comment/uncomment with line comment 行注释/取消行注释
Comment/uncomment with block comment 块注释/取消块注释
Select successively increasing code blocks 选择代码块,一般是增量选择
Decrease current selection to previous state 上个快捷键的回退,减量选择代码
Context info 上下文信息
Show intention actions and quick-fixes 意图行动,快速见效
Reformat code 根据模板格式对代码格式化
Indent/unindent selected lines 对所选行进行缩排处理/撤销缩排处理
- Ctrl + X or Shift + Delete
Cut current line or selected block to clipboard 剪切当前行或所选代码块到剪切板
- Ctrl + C or Ctrl + Insert
Copy current line or selected block to chipboard 拷贝当前行或者所选代码块到剪切板
- Ctrl + V or Shift + Insert
Paste from clipboard 粘贴剪切板上的内容
Paste from recent buffers 粘贴缓冲器中最新的内容
Duplicate current line or selected block 复制当前行或者所选代码块
Delete line at caret 删除光标所在位置行
Smart line join(HTML and JavaScript only)加入智能行 (HTML 和JavaScript)
Smart line split(HTML and JavaScript only)分离智能行 (HTML 和JavaScript)
Start new line 另起一行
Toggle case for word at caret or selected block 光标所在位置大小写转换
Select till code block end/start 选择直到代码块结束/开始
Delete to word end 删除文字结束
Delete to word start 删除文字开始
Expand/collapse code block 扩展/缩减代码块
Expand all 扩张所有
Collapse 缩减所有
Close active editor tab 关闭活跃编辑标签
Search/replace
搜索/替代相关快捷键
Find 当前文件内快速查找代码
Find in path 指定文件内寻找路径
Find next 查找下一个
Find previous 查找上一个
Replace 当前文件内代码替代
Replace in path 指定文件内代码批量替代
Usage Search
搜索相关快捷键
Find usages/Find usages in file 找到使用/在文件找到使用
Highlight usages in file文件中精彩使用
Show usages 显示使用
Running
运行
Select configuration and run 选择构架,运行
Select configuration and debug 选择构架,修补漏洞
Run 运行
Debug 修补漏洞
Run context configuration from editor 从编辑运行内容构架
Run command line 运行命令行
Debugging
Debugging相关快捷键
Step over 不进入函数
Step into 单步执行
Smart step into 智能单步执行
Step out 跳出
Run to cursor 运行到光标处
Evaluate expression 评估表达
Resume program 重新开始程序
Toggle breakpoint 切换断点
View breakpoints 查看断点
Navigation
定位相关快捷键
Go to file 通过文件名快速查找工程内的文件
Go to symbol 通过一个字符查找函数位置
Go to next/ previous editor tab 进入下一个/ 上一个编辑器选项
Go back to previous tool window 进入上一个工具窗口
Go to editor(from tool window) 从工具窗口进入编辑器
Hide active or last active window 隐藏活动窗口
Close active run/message/find/…tab 关闭活动….标签
Go to line 跳转到第几行
Recent files popup 弹出最近打开的文件
Navigate back/forward 导航前进/后退
Navigate to last edit location 向最近编辑定位导航
Select current file or symbol in any view 查找当前选中的代码或文件在其他界面模块的位置
Go to declaration跳转到定义处
Go to implementation(s) 跳转方法实现处
Go to type declaration 跳转方法定义处
Open quick definition lookup 打开定义快速查找
Go to super-method/super-class 跳转方法/超阶级
Go to previous/next method 在方法间快速移动定位
Move to code block end/start 跳转到编码块结束/开始
File structure popup 文件结构弹出
Type hierarchy 类型层次
Call hierarchy 调用层次结构
Next/previous highlighted error 跳转到后一个/前一个错误,高亮错误或警告快速定位,使用这个快捷键可以快捷在出错的语句之间进行跳转。
Edit source/ View source 编辑源代码/查看源代码
Show navigation bar 显示导航栏
Toggle bookmark 切换标记
Toggle bookmark with mnemonic 采用记忆切换标记
Go to numbered bookmark 跳转到带编号的标记
Show bookmark 显示标记
Refactoring
重构相关快捷键
Copy 拷贝
Move 移动
Safe Delete 安全删除
Rename 重新命名
Inline Variable 嵌入变量
Extract Method( Javascript only) 提取函数
Introduce Variable 引入变量
Introduce Field 引入域
Introduce Constant 引入常量
VCS/Local History
版本控制系统/ 本地历史相关快捷键
‘VCS’quick popup 快速弹出 VCS
Commit project to VCS 提交项目至VCS
Update project from VCS 从VCS 更新项目
View recent changes 查看最新改变
General
常用的相关快捷键
Find action 查找并调用编辑器的功能
Open corresponding tool window 快速切换打开界面模块
Toggle full screen mode 切换全屏模式
Toggle maximizing editor 切换最大化编辑器
Add to Favorites 将当前文件添至收藏夹
Inspect current file with current profile 使用当前属性检查当前文件
Quick switch current scheme 快速转换现有组合
Open setting dialog 打开设置对话框
Switch between tabs and tool window 标签和工具窗的转换(与windows快捷键冲突)
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/152265.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】:
Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】:
官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...