JetBrains WebStorm 2023 2023.1.1 官方正式版

Tags：WebStorm

JetBrains WebStorm 2023是系列的最新软件，在原有的旧版本上又做出了更新和优化，作为一款优秀的前端开发软件还是那么值得推荐的，想要更新的朋友们就快来下载这款软件开始新的体验吧！

软件特色

1、智能的代码补全

支持不同浏览器的提示，还包括所有用户自定义的函数。

代码补全包含了所有流行的库，比如：JQuery, YUI, Dojo, Prototype, Mootools and Bindows。

2、代码格式化

代码不仅可以格式化，而且所有规则都可以自己来定义

3、html提示

大家经常在js代码中编写html代码，一般来说十分痛苦，不过有了智能提示，就爽多了。而且html里面还能有js提示。

4、联想查询

只需要按着Ctrl键点击函数或者变量等，就能直接跳转到定义;可以全代码导航和用法查询

项目查找函数或者变量，还可以查找使用并高亮。

5、代码重构

这个操作有些像Resharper，熟悉Resharper的用户应该上手很快，支持的有重命名、提取变量/函数、内联变量/函数、移动/复制、安全删除等等。

6、代码检查和快速修复

可以快速找到代码中的错误或者需要优化的地方，并给出修改意见，快速修复。

7、代码调试

支持代码调试，界面和IDEA相似，非常方便。

8、代码结构浏览

可以快速浏览和定位

9、代码折叠

功能虽小，不过胜在方便高效

10、包裹或者去掉外围代码

自动提示包裹或者去掉外围代码，一键搞定。

安装步骤

1、在本站下载最新安装包，按提示安装

2、安装进行中，完成即可使用

更新说明

Astro 支持
备受期待的 Astro 支持已登陆 WebStorm！ 从 Preferences / Settings | Plugins（偏好设置/设置 | 插件）安装新的 Astro 插件即可获取。 插件提供基本功能，包括语法高亮显示、带自动导入的代码补全、重构、导航、正确的格式设置等。

Vue 模板中对 TypeScript 的支持
我们在 Vue 模板中添加了 TypeScript 支持。 它会在您将 script 标记中的 lang 特性设为 ts 时启用。 此前，无论 script 标记中的 lang 特性如何，使用的都是 JavaScript。 WebStorm 现在将提供对内联转换的支持、改进的类型缩小，并在 Vue 单文件组件模板的快速文档中提供正确的推断类型信息。

Vue 中的自定义组件事件补全
这个版本中还有一项 Vue 特定的改进值得关注。 现在，您将在 Vue 模板中获得自定义组件事件的代码补全。 它在 JavaScript 和 TypeScript 中相同。

复制粘贴时添加组件 import
将代码从一个文件复制粘贴到另一个文件时，WebStorm 会自动添加所有必需 import。 此前纯 JavaScript、TypeScript 语言和 React 模板是这种形式。 在 WebStorm 2023.1 中，它现在也适用于 Vue、Svelte、Astro 和 Angular 模板。

React 属性的形参信息
我们添加了一种新方式来显示组件属性的预期类型。 如果在将属性传递给组件时按 Ctrl+P，您将看到一个包含类型信息的弹出窗口。 此前，这些信息只能通过悬停显示，对于主要使用键盘的用户来说很不方便。

针对 Angular 的新功能
在 Angular 模板中，WebStorm 会在代码补全时自动将全局和导出符号的 import 添加到组件中。 IDE 还支持 Angular 15 NgoptimizedImage 指令，提供了建议对 img 使用 ngSrc 而不是 src 的检查。

在文件夹中运行 Jest 测试
您现在可以通过右键点击上下文菜单在特定文件夹中运行所有测试。 这个功能此前适用于 Vitest，现在我们也已为 Jest 实现。

Docker 改进
Docker-compose 节点的 Dashboard（仪表板）标签页现在将所有容器日志拉取到一处显示。 此外，您现在可以连接到 Azure 容器注册表。 阅读这篇博文了解详情。

Svelte 错误修正
我们一直在通过一个专属插件改进 Svelte 支持。 我们重做了 WebStorm 在 SvelteKit 应用中对 $types 求值的方式，并修正了 svelte 文件中特定于 TypeScript 的关键字的问题。

字符串到模板文字的自动转换
现在，WebStorm 在您输入 ${ 时会自动将带单引号或双引号的字符串转换为模板文字。 这适用于原始字符串以及 JSX 属性。

针对自动导入的改进导入库优先级顺序
从具有相同导出元素名称的不同库添加自动导入时，IDE 的行为有所改进。 自动导入现在根据项目中的现有导入添加。 如果需要为来自另一个库的元素添加 import，则必须手动添加 import 语句。 WebStorm 将像先前版本一样提供弹出窗口。

统一了 TypeScript 与 JavaScript 之间的导入行为
我们统一了 TypeScript 与 JavaScript 之间的导入行为。 在 TypeScript 中，您将在上下文操作中看到导入选项，就像在 JavaScript 中看到的一样。 按 Alt+Enter 即可打开上下文操作。 统一的设置位于 Preferences / Settings | Editor | General | Auto Import（偏好设置/设置 | 编辑器 | 常规 | 自动导入）。

对 TypeScript 功能的支持
WebStorm 包括对即将推出的 TypeScript 5.0 中主要功能的支持。 它还提供了对多重配置继承、类型形参的 const 修饰符和 allowImportingTsExtensions 标志的完全支持。

处理文件引用的通用方式
在 v2023.1 中，我们改进了 WebStorm 处理 JavaScript、TypeScript、HTML、CSS 和各种框架中的引用的方式。 现在，引用的处理方式在项目间更加通用。 例如，解析图像、CSS 或 HTML 文件现在可以使用路径别名。

Tailwind CSS 配置
在这个版本中，我们添加了对配置选项的支持，例如 classAttributes 选项下的自定义类名补全或 tailwindCSS.experimental.configFile 等实验性选项。 您可以在 Preferences / Settings | Languages & Frameworks | Style Sheets | Tailwind CSS（偏好设置/设置 | 语言和框架 | 样式表 | Tailwind CSS）下设置这些配置选项。

配置 HTML 代码补全的选项
WebStorm 2021.3 为 HTML 引入了补全，会在您输入时显示标记名称或缩写。 在 HTML 中输入纯文本时，这种行为可能会分散注意力，因此我们添加了将其禁用的选项。 您可以在 Preferences / Settings | Editor | General | Code Completion（偏好设置/设置 | 编辑器 | 常规 | 代码补全）中找到新选项。