从VS Code迁移到WebStorm

最新推荐文章于 2025-05-01 02:18:19 发布

四荒八极

最新推荐文章于 2025-05-01 02:18:19 发布

阅读量1k

点赞数 43

文章标签： webstorm ide

本文链接：https://blog.csdn.net/li__nan/article/details/147366058

版权

从VS Code迁移到WebStorm

打开或创建第一个项目

新建项目（New Project）——创建一个空项目或从现有模板生成一个项目，如React、Angular或Vue的模板。
打开项目（Open）——打开保存在电脑上的项目。
从版本控制系统获取（Get from VCS）——从Git或GitHub等版本控制系统获取现有项目。

配置快捷键

如果你以前从未使用过WebStorm或其他JetBrains IDE，那么适应新的快捷键可能会有些难度。

切换到VS Code快捷键

如果你想继续使用VS Code快捷键，可以直接切换。选择菜单“Settings | Keymap”，将VSCode或VSCode（macOS）设置为默认快捷键，然后保存。
请注意，某些版本的WebStorm中可能没有内置VS Code的快捷键。安装插件解决，选择菜单“Settings | Plugins”，然后搜索vscode。
安装后，可以选择菜单“Settings | Keymap”并设置为默认快捷键。
设置快捷键

学习WebStorm快捷键

以下是帮助你更快习惯WebStorm快捷键的方法：

记住WebStorm最有用的快捷键——双击Shift键。可以搜索任何文件、操作、类或符号，在搜索结果中查看所有匹配项。
安装Key Promoter X插件——这个插件可以帮助你在工作时学习基本的快捷键。当你在IDE内的菜单或按钮上使用鼠标时，Key Promoter X会在右下角显示对应菜单或功能的快捷键。下载地址：（https://plugins.jetbrains.com/plugin/9792-key-promoter-x）
使用WebStorm快捷键备忘单——下载适用于macOS、Windows、Linux的默认WebStorm键盘快捷键清单，打印成卡片。
WebStorm根据你的系统环境推荐快捷键设置。可以在“Settings | Keymap”中找到。如果修改了默认的快捷键，WebStorm把这些修改保存为副本，并默认使用该副本。

设置工作环境

WebStorm和VS Code之间的一个关键区别是，你不需要安装很多插件来使WebStorm更强大。几乎所有的功能都已经内置了。

自定义WebStorm

安装插件

在JetBrains IDE中，将扩展功能称为插件。插件的工作方式与VS Code中几乎相同，允许扩展内置功能并自定义IDE。要浏览可用的插件，请选择菜单“Settings | Plugins”，查看Marketplace标签页（可能需要科学上网）。
这是安装了Rainbow Brackets（彩虹括号）插件后WebStorm的样子。你可以阅读这篇博客文章（https://blog.jetbrains.com/webstorm/2020/05/plugins-for-webstorm-you-need-to-know-about/）来了解其他流行的插件，包括小地图插件（minimap one）。
安装Rainbow Brackets后
安装Rainbow Brackets插件前的样子
安装Rainbow Brackets前

修改主题

WebStorm只有几个预定义的主题，但有各种自定义选项可供选择。要探索它们，请选择菜单“Settings | Plugins”，然后在“Marketplace”选项卡中搜索Theme（主题）。
安装主题后，可以返回编辑器，查看安装的主题是什么样子。从主菜单中选择“View | Quick Switch Scheme”，或按 Ctrl + ` 选择主题。如下图所示：
安装主题插件

切换到Zen模式

像在VS Code中一样，如果你想专注于编码，可以切换到Zen模式。从主菜单中，选择“Navigate | Search Everywhere”，然后输入enter zen mode。如果要退出，搜索并选择Exit Zen Mode。

复制常见的VS代码工作流

命令面板（Command Palette）

Search Everywhere是VS Code命令面板的替代品。可以使用它来查找任何文件、操作、类或符号，并在搜索结果中查看所有匹配项。选择主菜单中的“Navigate | Search Everywhere”或单击编辑器右上角的放大镜图标打开它。
任意搜索

搜索替换

虽然WebStorm的搜索和替换工作流程与VS Code中的略有不同，但原则是相同的。WebStorm允许你在特定文件和整个项目中查找和替换字符串。请在主菜单中转到“Edit | Find”，然后选择“Find（查找）”（针对特定文件）或“Find in Files（在文件中查找）”（针对整个项目）。要替换字符串，请选择同一子菜单下的“Replace”或“Replace in Files”。