2023年最新最全 VSCode 插件推荐

Visual Studio Code 是由微软开发的一款免费的、针对于编写现代Web和云应用的跨平台源代码编辑器。它包含了一个丰富的插件市场,提供了很多实用的插件。下面就来分享 2023 年前端必备的 VS Code 插件!

2023年最新最全 VSCode 插件推荐_第1张图片

 前端框架

ES7+ React/Redux/React-Native snippets

该插件提供了许多速记前缀来加速开发并帮助开发人员为 React、Redux、GraphQL 和 React Native 创建代码片段和语法。

2023年最新最全 VSCode 插件推荐_第2张图片

例如,创建一个新文件并输入 rfce 然后按回车键,这将生成一个 React 函数组件,导入 React 并导出组件。

2023年最新最全 VSCode 插件推荐_第3张图片

VSCode React Refactor

这是一个专门为 React 开发人员设计的 VS Code 扩展。在处理大型项目时,重构可能很有挑战性。可以使用 VSCode React Refactor 快速重构代码,它会将 JSX 代码片段提取到新的类、组件中。此外,它还支持 TypeScript、TSX、常规函数、类和箭头函数。

Simple React Snippets

该插件提供了一组精心挑选的 React 代码片段,可以通过输入几个字母轻松地将其添加到代码中。例如,输入 imr 会将 React 导入到组件中。

2023年最新最全 VSCode 插件推荐_第4张图片

Typescript React Code Snippets

此插件包含了使用 Typescript 的 React 代码片段,它支持 Typescript(.ts) 或 TypeScript React (.tsx) 等语言。以下是使用 TypeScript 创建 React 组件的两个片段。

  • 默认导出 React:

2023年最新最全 VSCode 插件推荐_第5张图片

Vue Language Features (Volar)

默认情况下,我们的 Vue 组件看起来像这样:

2023年最新最全 VSCode 插件推荐_第6张图片

使用该插件可以获得漂亮的语法高亮显示、错误检查和代码格式化。并且,它还添加了很多 Vue 指令和事件处理程序,在输入时提供很好的建议。

2023年最新最全 VSCode 插件推荐_第7张图片

volar 是专门为 Vue 3 构建的语言支持插件。它基于 @vue/reactivity 按需计算一切,实现原生 TypeScript 语言服务级别的性能。

随着 Vue 3 + TypeScript 越来越流行,Vetur(Vue 的官方 VS Code 扩展)开始出现问题,例如,将 Vue 与 TypeScript 一起使用时 CPU 使用率过高,或者不支持 Vue 3 的新 

你可能感兴趣的:(前端,工具,前端软件,vscode,javascript,前端,前端插件)