VSCode的功能如此强大,这与它们的插件密密相关,插件的安装起来超级简单,种类繁多,这给我们开发人员提供了很好地的便利。但是新手学习期间不需要安装许多插件,这里我来给大家介绍一下新手学习前端常用的插件吧。

一、常用的插件

1、Chinese (Simplified) 汉化

  这是一个把英文转换为中文的插件,一般下载软件后我们第一个要安装的插件,方便我们看软件整体的界面。

2、Auto Rename Tag

  在修改标签时,会自动修改另外一个相对应的标签,可以提高写代码的效率。

3、One Dark Pro

  一个页面的主题,有利于更好的看代码,个人比较喜欢用这个主题,主题页面如下图。

 

    

4、格式化代码(软件自带)

  可以自动格式化代码的样式,新手建议自己手写规范语法格式,设置方法如下:

  (1)在左下角选择管理,然后点击设置

    

  (2)点击文本编辑器,选择格式化,然后把右边三个框框(format  on paste、format on save、format on type)都勾选上。

    

5、open in browser

  运行代码时,需要浏览器浏览,需要用到这个插件

  

6、live sever

  实时在线浏览,在写代码时保存代码,即可刷新浏览器,改代码时特别的方便,强烈推荐大家安装这个插件,真的很好用!

  但是需要注意的是,要打开文件的目录文件夹才可以使用哦,可以从文件 → 打开文件夹/新建文件夹 打开使用。

  

  

7、会了吧

  一个将英语翻译为中文的插件,如果有不认识的单词我们可以点击右侧图标,即可看见全文的英文翻译哦,这样对可以很快的知道单词的意思啦!

  

  

二、如何安装插件

  我以安装第一个插件Chinese (Simplified)为例

  1.、点击左侧的一个类似正方形的拓展按钮

  

  2、在搜索栏里找到我们想要的插件,然后选择插件点击安装install

  3、安装好后选择restart重启

  

  4、等待重启后插件就安装好了

  

以上是我个人的分享及方法,如果有写得不正确的地方,各位伙伴可以在评论指出哦~如果有不明白的,也可以评论或者私信我,欢迎大家一起来学习交流吖~

前端VSCode常用插件及安装相关推荐

  1. 前端VSCode常用插件安装和使用

    本篇文章先介绍下常见的插件~~~~ VSCode常用的插件 vscode之所以被称为宇宙第一神器,其中丰富的插件功不可没,安装起来超级简单,给我们开发带来了极大的便捷. 注意,新手学习期间,不建议安装 ...

  2. 千锋重庆web前端技术分享之前端VSCode常用插件

    一.VSCode常用的插件vscode之所以被称为宇宙第一神器,其中丰富的插件功不可没,安装起来超级简单,给我们开发带来了极大的便捷. 注意,新手学习期间,不建议安装形形色色的插件,用到啥就安装啥.因 ...

  3. 前端vscode常用插件

    Auto Rename Tag 这是一个html标签的插件,可以让你修改一边标签,另外一边自动改变. Beautify 格式化代码插件 Braket Pair Colorizer 给js文件中的每一个 ...

  4. VsCode常用插件和快捷键

    VsCode常用插件和快捷键 vscode快捷键 alt+w:快速打印变量(需要插件Wrap Console Log) alt+q:加书签 alt+d:加`<div>`标签(htmltag ...

  5. VScode常用插件下载

    VScode常用插件下载 记录自己第一次使用VScode,边学习边记录,以后继续努力! Visual Studio Code的插件系统很好用,虽然vscode自带的功能比较少,但很多插件可以帮我们实现 ...

  6. 【VSCode常用插件】Path Autocomplete(@路径提示的插件)

    前言 ❤️ 在路上,见识世界:在途中,认清自己 ❤️ [VSCode常用插件]Path Autocomplete(@路径提示的插件) 一.安装教程 二.设置教程 (1)在vscode设置打开 sett ...

  7. vscode常用插件大全

    vscode常用插件大全 参考文章 https://mp.weixin.qq.com/s/1PkWPApvn5uWJl_cdzcoTA 说明 该片文章基本介绍了 vscode 常用插件 , 已经很全面 ...

  8. sublime text 3 前端开发常用插件

    sublime text 3 前端开发常用插件 https://packagecontrol.io/browse 代码对齐: Alignment html代码补全:  Emmet CoffeeScri ...

  9. 【Vscode】 Vscode常用插件

    Vscode常用插件

最新文章

  1. Nand Flash,Nor Flash,BPI Flash,SPI Flash 的区别?
  2. ruby Encoding
  3. JSP-03-实现数据传递
  4. mysql无法创建存储过程问题 ERROR 1307 (HY000)
  5. Electron使用NodeJS扩展模块调用DLL
  6. 写入接口c语言_PYNQ: 使用CFFI嵌入C语言
  7. Java 8:按集合分组
  8. 初识好朋友计算机课件,-精选版初识我们的好朋友——计算机.ppt
  9. MySQL事务隔离级别及场景测试
  10. JavaScript日期有效性检查
  11. IT项目管理之系统规划
  12. java决策树算法_零基础学习大数据开发技术需要哪些基础知识(1)Java、大数据基础...
  13. Win11快速截屏的4种方法介绍
  14. ubuntu SecureCRT 下载并破解
  15. php7 ob get contents,关于ob_get_contents(),ob_end_clean(),ob_start(),的具体用法详解
  16. 微粒群算法(二、案例实现)
  17. edm邮件直投_EDM邮件直投专家下载
  18. WPS参考文献自动生成方法
  19. 干果进口关税是多少天津食品进口应办理哪些手续?
  20. 2023二建建筑施工备考第二天Day04

热门文章

  1. 响应式品牌策划公司企划策划网站源码 品牌策划类网站pbootcms模板
  2. 计算机补码的表示形式,补码(计算机中数字的表示方式)
  3. 【C++资料免豆下载】大量教程+工具+源码下载地址汇总(转载)
  4. MySQL数据库——实体完整性
  5. python过京东app图形验证勾股定理_拼图验证勾股定理及勾股定理中的数学思想
  6. 【软件设计师】软件设计师考试内容及分值分布
  7. 决策树算法模型的归类与整理(ID3&C4.5&CART&线性二分类&非线性二分类)
  8. 多台Ubuntu系统电脑使用ntp时间同步
  9. 计算机信息第三册教案,信息技术第三册教案
  10. python3.6入门零基础_Python 3零基础完全入门(面向2020, Python3.6/3.7,不断更新ing)...