webstorm 2021.1 版本使用体验

前言

前些天webstorm推送了2021年的第一个版本更新，此次的版本更新加了一些新功能，接下来就跟你们分享下此次的新版本都有哪些新特性，欢迎各位感兴趣的开发者阅读本文。css

新特性一览

在新的版本中才使用机器学习算法优化了代码补全，添加了html预览功能，添加了编辑器字体粗细选择等功能。html

ML辅助代码补全

在JavaScript和TypeScript文件中的补全建议如今经过机器学习算法对其进行了排序，经常使用的api将排在最前面。vue

咱们经过一段代码来演示下，以下图所示：web

符号名称补全建议

当咱们在文件顶层声明变量以及函数和类名时，补全建议时将当前文件名，效果图以下所示：算法

改进JSDoc 语法高亮显示

为了使 JSDoc 注释更易读，新版本中添加了一些新选项，用于调整 JSDoc 标记值和类型的配色方案。在 Preferences / Settings | Editor | Color Scheme | JavaScript / TypeScript 中进行设置。编程

内置远程协做开发服务

新版本中内置了Code With Me ，这是一款用于远程协做开发和结对编程的新服务。可使用它进行实时合做编码，并以 IDE 与其余人交流，如图所示，点击工具栏的图标便可进入。windows

详细使用方法请移步：IDE远程协做api

支持Vue中的css块

在新版中支持了 .vue 文件中使用的 CSS 模块。 IDE 将正确解析 $style 属性，为其提供代码补全、导航和基本的重构功能，以下图所示：浏览器

改进了对 Stylelint 的支持

点击几下便可使用 Stylelint 修复 CSS 代码。将鼠标悬停在文件中的问题上或将文本光标放在其上，而后按 ⌥⏎，选择 Stylelint: Fix current file。markdown

能够在 Preferences / Settings | Languages & Frameworks | Style Sheets | Stylelint 的相应字段下指定其配置文件的路径。

内置 HTML 预览

新版本中能够直接在 WebStorm 中预览静态 HTML 文件。对 HTML 文件或连接的 CSS 和 JavaScript 文件所作的变动将被保存，预览将自动从新加载，用个gif图来演示下，以下所示：

CSS 的选择器特异性

使用样式表时，如今能够查看选择器的特异性 - 只需将鼠标悬停在要查看的选择器上便可。或者，将焦点放在选择器上，按 F1 在文档弹出窗口中查看这些信息。

可调整字体粗细

新版本中能够选择不一样的编辑器字体，包括浅色、常规和粗体。在 Preferences / Settings | Editor | Fonts 下调整这些新选项。

最大化分割视图中的选项卡

在分割视图中打开了多个选项卡时，双击要处理的选项卡，使其编辑器窗口最大化。再次双击便可将选项卡恢复到原始大小，咱们经过一个gif图来演示下：

更实用的快速文档

MDN 文档现与 WebStorm 捆绑。这将有助于防止 MDN 网站的链接问题，并使编辑器内文档显示得更快。如今它也提供了更多信息，例如，您将看到有关 JavaScript API 的支持浏览器版本的详细信息。

改进了 Pull Request 的使用

如今能够直接在 Pull Requests 工具窗口中单击 + 图标建立新的 PR，以下所示：

更多改进请移步：Pull Requests的更多加强

获取更新

讲了那么多新特性，接下来就教你们如何从旧版本升级到新版本。

windows端菜单栏依次点击: Help -> Check for updates以下图所示

mac端，依次点击webstorm -> check for updates，以下图所示

随后会出现提醒下载的窗口，按照操做更新便可。

若是你是第一次使用WebStorm，可点击下方连接去官网下载安装便可，官网地址： webstorm。

更多新版本更新内容请移步：webstorm 2021.1 whatsnew

不足自处

新版本更新后，一直免费的主题插件：Material Theme UI 开始收费了😭，15美刀/年。

版本升级后，这个插件强制更新了，没法回退，若是使用免费版本的话，文件目录树看起来会很小，极不舒服。

不知道你们有没有白嫖的方法，我如今是30天试用🤣

写在最后

文中使用的部分图片源自webstorm官网，如若侵权，请评论区留言，做者当即删除相关图片。
文中若有错误，欢迎在评论区指正，若是这篇文章帮到了你，欢迎点赞和关注😊
本文首发于掘金，未经许可禁止转载💌