花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

这是我参与8月更文挑战的第26天,活动详情查看:8月更文挑战

从vscode转向webstorm的原因

一个维护了一年多的Vue项目需要重构下,很多文件的目录结构需要调整,但是每个文件的交叉引用特别多,修改文件位置的github话同时修改文件的相互引用。

在vscode中我把一个文件Aelementary是什么意思动位置,或者改名字,理论上来说,引用A文件的路径应该会全部改变,但是仓鼠寿命只有部分改变,摸不清它的规律。

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

在webstorm中移动位置就不会有这个问题,webstorm重构的功能做的太稳定了,不管是移动的是什么文件,js变量,vue,img,css,或者把文件名改成什么样子,只有其他文件用到了,路径都会改掉。

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

这是我转到webstorm的主要原因。

从vscowindows怎么激活de到webstorm的快速转换

步骤:

  1. 安装webstorm,官网下载,30天试用
  2. webstorm安装vscode的键盘快捷方式github是干什么的
  3. 安装主题
  4. 其他设置

下载安装试用

下载推荐从elementary是什么意思官网下载最新版本,学生可以申请一年试用,github有3个月提交项目的也可以申请试用。 下载安装就不说了,都会。windows无法连接到打印机

webstorm安装vwindows7旗舰版scode的键盘快捷方式

仓鼠寿命用vsElementcode2年多了,基本上所有的快捷键都用的溜溜的,所以到了webstorm打算使用一样的快捷方式。 第一步,打开Preferences,Mac打开快捷键是 Command+,

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

第二步,下载vscodGite ke变量类型有哪些ymap

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)
第三步,应用

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

这样就设置好了。下面说一下快捷键的区windows10

快捷键的区别+自定义快捷键

做了以上设置之后,大部分快捷键是相同的了,还有一些细微的区别,需要手动调整

相同的快捷键: (windows把co仓鼠寿命mmand换成ctrl)

  • command+\ 分屏
  • commwindows10激活密钥and+p 打开文件
  • commgithub是干什么的and+shift+p 打开指令执行框
  • alt+shift+↓ 复制当前内容到下一行
  • ctrl+` 打开终端

不同的快捷键:

  • vscode的command+f是替换,webstorm的command+f是查找
  • vscode的command+shift+f是全gitee局替换,webstorm的command+shift+f是全局查找

对于不同的快捷键,可以手动更改快捷键设置,以替换为例说明一下操作步骤:

  1. 找到webstorm的command+f快捷键对应的功能,把快捷键删除
  2. 找到webstorm的替换功能,添加command+f快捷键elements

command+,打开偏好设置,然后操作如图所示

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

你也可以通过这种方式定义自己的快捷键

webstorm安装主题

我vscode用的是one dark pro主题,在wwindows更新有必要吗ebstorm中保持一致

第一变量与函数步,打开Preferences,Mac打开是 Command+,

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

第二步,在plugins中下载vscowindows更新有必要吗de keCSSymap

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)
第三步,设置主题

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

其他设置

代码格式Element

我vscode还是webstormelementui都是使用的prettier格式化的,项目中依赖安装了prettier依赖,在webstorm中设github是干什么的置一下即可 Command + ,打开偏好设置辰时是几点到几点

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

界面汉化

Command + ,打开偏好设置,点击plugins面板,搜索安装chinese语言包Windows就行。

项目设置

webgithub是干什么的storm默认双击打开文件,可以改成单击 webstorm默认侧边栏不会自动跳转至选中文件,可以修改

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

Webstorm的优点

代码重构

上面说了,修改文焯是什么梗件名,文件移动位置,会更新引用,正确率100%

函数名重命名的快捷键是F2,操作方变量的指针其含义是指该变量的式是选中要重命名elements硬盘的函数名,按F2变量

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

代码跳转

代码跳转,级:在组件,函数,变量上按住command(或ctrl),点一下,会跳转到函数定义的变量与函数地方。

vgithub是干什么的scode的缺点变量名的命名规则如下:

  1. vue变量名的命名规则文件中的自定义组件有时候点击无法跳转
  2. 如果是TS的项目,点击会跳到声明变量类型有哪些文件
  3. 对于定义的less或者scss或者仓鼠死前征兆css变量,点击跳转不过去

webstorm的elementary优点就是万变量的定义物皆可跳转。

自定义组件可以跳转:

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

less变量可以跳转:

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

这里需要补充一个功能,返回上一个鼠标位置,你点f12跳到了一个地方,还要跳回去,就需要这个功能,你可以绑定你喜欢的快捷键,在vscode中的command+u

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

如果你项目中用到了UIWindows库,例如element-ui,iview,antd等,按住com变量泵mand点击UI库中的组件会自动跳转到组件的源码,这带来的好处是,你熟练了之后不用在网页上打开对应的文档了,直接查看对应的props即可。

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

如果有了bug,还可变量的指针其含义是指该变量的以顺便看下源码是怎么实现的,长此以往,编程能力就提高了。

此外,如果要看源码的话,webstorm是比vscode方便很多的,因为每个地方都可以快速windows无法连接到打印机跳转,不存在跳不过去的地方。

代码提示

写代码时,如果没有用TS,vscodgiti轮胎是什么品牌e的代码giti轮胎提示就不太够。缺点如下潮汕是哪个省的城市

  1. 自定义的lewindows更新有必要吗ss或者scss变量没有提示
  2. 自定义组件windows是什么意思的提示
  3. 自定义变量和方法变量名的提示

对于2和3,vscode可能需要安装插件支持,webstorm的这些功能都是内置的

webstorm的提示:

less变量提示:

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

自定义变量的提示:

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

简直让JS写出了TS的感觉

此外,webstor变量类型有哪些m会自动进行代码拼写检查以及代码错误检查,以及代码哪里写的不好,告诉你推荐的写法,

vscelement是什么意思ode需要安装插件才能进行代码拼写检查

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

webstorm会在git提交前变量是什么意思进行统变量英文一的代码检查,帮你找到不容易发现的错误,例如400px 少些了个px这种错误

git操作

giti久了才发现webstorm的git操作天下无变量的定义敌。

webstorm中git的基本操作:

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

下面说几个常用的操作:

查看当前文件的提交记录

这个功能可以帮你快速仓鼠死前征兆找到是谁写的bug。在边栏上鼠CSS标右键,点击Annotate with Git Blame

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

查看当前文件的提交历史

gitlab空白处右键,在右键菜单点击以下内容:

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

当前文件与其他分变量的定义支上的当前文件对windows7旗舰版

这个功能在vscode上没有找到,操作也仓鼠寿命是在文件空白处右键

花半天时间从Vscode转向Webstorm(Vscode在Webstorm面前就是个弟弟)

总结

vscode也是有很多优点的,比elementary是什么意思

  • 轻量,打开快
  • 主题多
  • 多光标特性,虽然webstorm也有,但是command+shift+i 为每一行添加光标的快捷键用不了
  • 插件多
  • 不要钱element是什么牌子
  • 占用内存少

所以vscode的使用场景应该Git是小型项目,写demo。webstrom的使用场景是看源码、大型项目、项目重构

评论

发表回复