在Visual Studio Code中安装加速TypeScript程序开发的插件

news/2024/7/16 10:18:34 标签: vscode, typescript, ide

在Visual Studio Code中安装加速TypeScript程序开发的插件

Install Extensions on Visual Studio Code for TypeScript Application Development

By Jackson
2023-11-28

众所周知,微软的Visual Studio Code是一款轻量级、功能强大的集成开发环境。它支持各种编程语言,像C/C++,Java, Python, JavaScript, TypeScript, PHP, Rust, Ruby, Go, Kotlin, Bash等等。同时,利用其自带的mareketplace,可以找到功能强大的各类插件以丰富Visual Studio Code的开发功能。

为了加强TypeScript开发,笔者建议安装一些必要的、非常有效的Extension(扩展),也就是通常所说的插件。

打开Visual Studio Code,通过点击Extensions (或者按组合键 Ctrl + Shift + X),打开marketplace搜索栏,在此安装您喜欢的Extension吧。

1. TypeScript Extension Pack

这个插件包含了一些最常用、最流行的TypeScript功能插件,安装好后无疑会对TypeScript开发铺平了道路。
在这里插入图片描述

2. JavaScript and TypeScript Nightly

功能是启用TypeScript Nightly主题,作为VS Code的内置TypeScript版本,同时支持JavaScript和TypeScript IntelliSense。

在这里插入图片描述

3. ESLint

功能是集成ESLint JavaScript到VS Code。

在这里插入图片描述

4. Quokka

Quokka.js 是一个开发人员生产力工具,用于快速 JavaScript / TypeScript 原型(prototype)设计。当你键入代码时,运行时值会更新并显示在 IDE 中的代码旁边。

在这里插入图片描述

5. Live Server

功能为对HTML页面在本地服务器(localhost)上的静态页面重载。当完成HTML页面内容时,用鼠标右键单击,在右键菜单上点击Live Server,能够快速激活该页面的显示效果(Web服务器默认在本地主机)。

在这里插入图片描述

6. Open in Browser

功能为在默认浏览器中打开当前的HTML文件。当需要浏览网页时,右键单击该HTML文件, 在右键菜单中选择单击Open in Default Browser,即用默认浏览器打开页面。

在这里插入图片描述

7. TypeScript Import Sorter

功能是根据提供的配置对TypeScript导入(import)进行排序。配置默认值遵循 ESLint 排序导入规则。配置支持正则表达式函数设置排序优先级和规则。只要两者的配置设置一致,该扩展就可以与prettier一起使用。

在这里插入图片描述

8. Docstrings

功能为生成、保存和维护文档字符串并将README保存和持久化文档字符串。这一功能需要有效订阅才能生效。

在这里插入图片描述

9. Auto Close Tag

功能为自动添加HTML/XML关闭标签。该插件目前下载量达到
例如:在输入< div> 时,输入完最后一个尖括号>时,会自动添加对应的闭合标签< /div>。

在这里插入图片描述

10. Auto Rename Tag

功能为自动重命名成对的HTML/XML tag(标记)。
例如,将< div>< /div>标签重命名为标签时,只需修改第一个div标签名称为span,后跟的div标签也会自动跟着改成span。
在这里插入图片描述

11. Color Highlight

功能为对CSS/web中的颜色值高亮显示。

在这里插入图片描述

vscodeicons_59">12. vscode-icons

用于Visual Studio Code的图标。当使用Visual Studio Code打开项目时,会根据项目中文件类型显示该文件对应的图标。

在这里插入图片描述

13. Rainbow Brackets

功能是高亮显示代码中匹配的各种括号,并以不同颜色匹配显示,像彩虹一样丰富视觉效果。

在这里插入图片描述

本文简要介绍了在marketplace能够找到的,对TypeScript开发有极大帮助的Extensions(扩展),这些也成为插件的组件,将使TypeScript开发工作高效有趣,事半功倍。

技术好文陆续推出,敬请关注。

喜欢就点赞哈,您的认可,我的动力!😊

相关阅读

  1. JavaScript 编程基础 - 布尔值
  2. JavaScript 编程基础 - 对象
  3. JavaScript 编程基础 - 函数进阶
  4. JavaScript编程基础 - 条件语句
  5. JavaScript编程基础 - 函数入门
  6. JavaScript编程基础 - 变量
  7. JavaScript编程基础 - 输出

http://www.niftyadmin.cn/n/5224082.html

相关文章

Zabbix 6 详细安装部署教程

目录 一、安装 MySQL 数据库 二、安装 zabbix 监控平台 三、编辑配置文件 四、启动服务 五、zabbix-web 安装 zabbix web 出图展示乱码问题解决方案 zabbix 的安装部署非常简单&#xff0c;官方提供了四种安装途径&#xff0c;分别是二进制 rpm 包安装方式、源码安装方…

Spring Security 6.x 系列(6)—— 显式设置和修改登录态信息

一、前言 此篇是对上篇 Spring Security 6.x 系列&#xff08;5&#xff09;—— Servlet 认证体系结构介绍 中4.9章节显式调用SecurityContextRepository#saveContext进行详解分析。 二、设置和修改登录态 2.1 登录态存储形式 使用Spring Security框架&#xff0c;认证成功…

Unity3d 灯光阴影开启,法线贴图出现BUG

URP项目打开灯光的阴影后&#xff0c;法线贴图出现BUG 解决方案&#xff1a;按照下图所示调整材质的选项即可

企业认为绩效考核艰难的原因

考核指标是绩效管理的基础和依据&#xff0c;是所有工作的出发点&#xff0c;所谓差之毫厘&#xff0c;谬以千里&#xff0c;若考核所选指标有问题&#xff0c;那由此导出的结果必然有问题。 绩效管理&#xff0c;绝对是企业管理中处境最尴尬、令人又爱又恨的一项工作明知它是…

AlphaFold的原理及解读

1、背景 蛋白质是生物体内一类重要的生物大分子&#xff0c;其结构复杂多样&#xff0c;蛋白质的结构对于理解其功能和参与的生物学过程具有重要意义。从生物学角度上看&#xff0c;蛋白质的结构可以分为四个层次&#xff1a;初级结构、二级结构、三级结构和四级结构。 初级结…

2020年6月9日 Go生态洞察:VS Code Go扩展加入Go项目

&#x1f337;&#x1f341; 博主猫头虎&#xff08;&#x1f405;&#x1f43e;&#xff09;带您 Go to New World✨&#x1f341; &#x1f984; 博客首页——&#x1f405;&#x1f43e;猫头虎的博客&#x1f390; &#x1f433; 《面试题大全专栏》 &#x1f995; 文章图文…

C++11中的call_once/once_flag使用

为了保证在多线程环境中某个函数仅被调用一次&#xff0c;比如&#xff0c;需要初始化某个对象&#xff0c;而这个对象只能初始化一次&#xff0c;就可以用std::call_once来保证在多线程环境中只被调用一次。使用std::call_once是&#xff0c;需要一个once_flag作为call_once的…

【C 语言经典100例】C 练习实例13 - 水仙花数

题目&#xff1a;打印出所有的"水仙花数"&#xff0c;所谓"水仙花数"是指一个三位数&#xff0c;其各位数字立方和等于该数 本身。例如&#xff1a;153是一个"水仙花数"&#xff0c;因为1531的三次方&#xff0b;5的三次方&#xff0b;3的三次方…