从VSCode到WebStorm,我后悔了吗?

June 22, 2024

是的,又一篇关于代码编辑器的文章。以前的我说过,不要纠结什么软件厉害,什么软件是行业标准,只管用适合你的,但是今天我又在这里讲抛弃用了两年的 VSCode,头也不回地就加入了 WebStorm 的阵营。我错了吗?我没有,我只是发现 WebStorm 更适合我。

不过讲真的,第一天使用 WebStorm 最直接的感受就是 —— 累。

  • 超级复杂的配置项
  • 摸不着头脑的设置同步
  • 发育不良的插件市场
  • 一点头绪都没有的快捷键,甚至有点反人类
  • 奇怪的版本管理
  • 无法理解的单项目设计

等等等等,还有数不清的无法习惯的习惯,让我一度开始怀疑自己这项决定是否正确和值得。

光是解决tabSize就花了我半天时间,你需要进每个文件类型选择相应的tabSize。这一点相比 VSCode 确实不怎么方便。但是往好了想,独立的文件配置确实会让你看起来更加专业,对于一些特殊的文件类型也可以自定义配置。这就好像 WebPack 和 Parcel 的区别,一个方便但是傻,一个聪明但是麻烦。好在这些东西你只需要设置一遍,因为 WebStorm 和 VSCode 一样,都有同步设置的选项。

WebStorm 同步主要有两种:

  • Git 仓库同步
  • JetBrains 账号同步

作为小白的我第一次用就算是踩到了坑,直接使用了 Git 仓库同步。你需要在任意 Git 平台新开一个仓库来存储所有的设置,可以从本地提交覆盖线上的设置 (Push),也可以从线上下载覆盖本地的设置 (Pull),听起来一切都很完美,然而 Git 仓库不支持同步插件。主要是,在你使用 Git 仓库同步设置之后,使用 JetBrains 账号同步的功能是置灰的,也就是说一次只能使用一个同步方式,为此我还特地去论坛上查了一下怎么使用 JetBrains 账户同步设置。好吧,你需要先把之前设置的 Git 仓库地址删掉,之后才可以使用 JetBrains 账号来同步。当然了,这一项功能仅限购买了正版 WebStorm 的用户使用😎。使用账户同步之后一切都变得简单了,一切设置和插件更改都能多端同步。

说到插件,WebStorm 的插件市场和 VSCode 比起来可以说是 “发育不良”。截至我写博客的这个时间点,VSCode 已经有 22k + 之多的插件了,而 WebStorm 只有 2.7k+。造成这一现象的原因,我猜不只是因为 VSCode 更受欢迎或者开源之类的,WebStorm 作为一个 IDE 本来就包揽了强大功能的同时也造就了插件市场的萎靡。不过苦苦寻找之后,作者还是发现了几个之前在 VSCode 上钟爱的几款插件:

最喜欢的当然还是 VSCode Keymap,习惯一款软件的快捷键需要漫长的时间,这是我当下不愿意支出的时间成本。

最后两点让我很难受就是版本控制的 UI 设计和一次只能打开一个项目的设计了。

为什么说版本控制的 UI 让我很难受,确实,信息量对比无插件的 VSCode 来说多了不少,但是 Push 操作面板要和提交面板分开?是为了不让用户误触吗?是为了防止新手乱搞吗?然而问题是,菜鸟总有办法乱搞,Pro 总有办法恢复。

至于单项目设计,我看论坛上已经有人问过了:

如何在一个 WebStorm 实例中打开多个项目?

官方给出的回答是:Never. (我帮你们简化了一下

不过,替代方案总归是有的,左上角找到File → Attach Project,这样确实可以实现一个 WebStorm 实例打开多个项目。但是随着我更加深入的使用 WebStorm,渐渐地我发现了这样设计的妙处。

一次打开一个项目可以让你更加专注在项目上,而不用多个项目切换来切换去,而且你可以针对每个项目做出不同的配置,比如 Web 服务、Npm 脚本或者项目构建,在单实例单项目的模式下,你可以很好的专注在这些细节上。

很多人追求做 Web 开发就是要快,所以代码编辑器一定也不能慢,在后续一系列的测试中也表明了,VSCode 不论是启动速度还是代码提示速度确实比 WebStorm 要快。以前的我对这些也是洋洋得意,但是看了很多反面描写的文章之后,我开始意识到,速度快,并代表你能写好代码。这也是为什么我会有这样的好奇心来试一试 WebStorm 是不是真的像他们说的那么好。

在实际使用中,WebStorm 从启动到完全显示 UI 组件大概在 10-20 秒之间,VSCode 大概在 5 秒以内,启动速度确实慢了一些,但是处于可接受范围内。再来看生产效率,WebStorm 几乎会在任何地方给你提示:

  • 编辑 Vue 项目时,可以跟踪到内嵌在 html 标签上方法和变量,也有语法高亮
  • 编辑 JS 文件时,可以跟踪一个不在当前文件中的方法
  • 编辑 JS 模版时,会高亮 html 语法

同时,得益于单实例单项目的设计,Reference 和 Usage 模糊查询几乎不会出错。

再说代码格式化 (Reformat),WebStorm 格式化一个 3000 行的 Less 文件只需要 200ms 左右,而同样使用 Prettier 引擎的 VSCode 需要 800ms - 1000ms 左右。

更甚于,WebStorm 会把所有的不规范的语法,事无巨细的告诉你,初期我只觉得烦,后来慢慢的,一点点的去核查,一点点的消除警告和错误,才发现,WebStorm 一直在尝试让你写出规范漂亮的代码,在项目初期就直接规避掉日后可能会使整个项目崩溃的小错误。

所以,从 VSCode 到 WebStorm,我后悔了吗?

嗯,暂时还没有,为什么说暂时呢,按照 VSCode 的发展速度,以及其插件市场的扩展速度,可能没几年,VSCode 的体验就会超过 WebStorm,至于 JetBrains 公司是否会因为感到压力陡增进而加速发展对应产品,我们拭目以待吧!