Visual Studio Code 常见的配置、常用好用插件以及【vsCode 开发相应项目推荐安装的插件】

这篇具有很好参考价值的文章主要介绍了Visual Studio Code 常见的配置、常用好用插件以及【vsCode 开发相应项目推荐安装的插件】。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。


一、VsCode 常见的配置

1、取消更新

  • 把插件的更新也一起取消了

2、设置编码为utf-8:默认就是了,不用设置了


3、设置常用的开发字体:Consolas, 默认就是了,不用设置了

  • 字体对开发也很重要,不同字体,字母形态都不太一样,尤其是标点符号,逗号和分号的区分,有的字体看着这两者就很像

4、设置ctr+滚轮,改变字体大小


5、设置行号:默认就有,不用设置了


6、自动保存:


7、设置选项卡多行展示

  • 这样打开了很多个文件,就不会导致有的打开的文件被隐藏

8、设置查看当前类或文件的结构 OUTLINE

  • 相当于idea 查看当前类或接口的结构 Structure



二、VsCode 常用好用插件

1、实时刷新网页的插件:LiveServer


2、open in browser

支持快捷键与鼠标右键快速在浏览器中打开html文件,支持自定义打开指定的浏览器,包括:Firefox,Chrome,Opera,IE以及Safari


补充一下:LiveServer 和 open in browser 区别:注意观察浏览器地址栏

  • open in browser:直接打开HTML文件就是通过File协议打开的
  • LiveServer: 通过http 协议打开的,地址栏会上看到主机名, Live Server启动了一个本地开发服务器,静态和动态页面都可以实时重载。

3、自动闭合HTML/XML标签:Auto Close Tag


4、图片自动检查:Image preview


5、资源树目录:vscode-icon

它不仅能够给文件夹、文件添加上舒适的图标,而且可以自动检测项目,根据项目不同功能配上不同图标


6、AI 智能提示的插件:Tabnine

用IDE编写代码的时候可以给出智能提示,写的越多提示的越准确




选择性安装的插件

像颜色提示、主题那种,还有语法检查、语法智能提示等

本地历史代码记录: local history

git相关的插件:Git History

  • Git History提供了一个可视化的git日志。不再需要在终端查看git日志。可以比较各个分支、提交和跨提交的文件。

HTML CSS Support

  • 智能提示CSS类名以及id

HTML Snippets

  • 智能提示HTML标签,以及标签含义

JavaScript(ES6) code snippets

  • ES6语法智能提示,以及快速输入,不仅仅支持.js,还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间

jQuery Code Snippets

  • jQuery代码智能提示

CSS Peek

  • 使用此插件,你可以追踪至样式表中 CSS 类和 ids 定义的地方。当你在 HTML 文件中右键单击选择器时,选择“ Go to Definition 和 Peek definition ”选项,它便会给你发送样式设置的 CSS 代码。



一、VsCode 开发相应项目推荐安装的插件

1、开发 Vue 项目必装的插件

(1)【vue2】安装一个方便阅读 vue 代码的插件:Vetur

  • 安装之后,vue 代码,文本颜色开始发生变化[注释是绿色的哈哈哈],不安装,代码全是白色的。

Vetur插件介绍:功能包括-语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger。vscode官方钦定Vue插件,Vue开发者必备。

  • vue3 使用的是插件 Vue Language Features (Volar)

2、开发 Lua 项目必装的插件

(1) 安装一个方便阅读 lua 代码的插件:lua




如果本文对你有帮助的话记得给一乐点个赞哦,感谢!文章来源地址https://www.toymoban.com/news/detail-415224.html

到了这里,关于Visual Studio Code 常见的配置、常用好用插件以及【vsCode 开发相应项目推荐安装的插件】的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Visual Studio Code前端开发插件推荐

    Visual Studio Code(简称VS Code)是一款轻量级且强大的开源代码编辑器,广受前端开发者的喜爱。其丰富的插件生态系统为前端开发提供了许多便利和增强功能的插件。本篇博客将向大家推荐一些在前端开发中常用且优秀的插件,并提供详细的使用说明和代码示例。 Live Server是一

    2024年02月12日
    浏览(68)
  • Visual Studio Code 珍藏好久的插件推荐

    目录 1、Prettier - Code formatter ​2、ESLINT 3、Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code 4、GitLens — Git supercharged 5、vscode-icons​编辑 6、Remote - SSH 7、Auto Rename Tag 8、Vetur 9、Path Intellisense 10、Auto Close Tag 11、ES7+ React/Redux/React-Native snippets 12、Code Spell Checker 13、npm Intelli

    2024年02月09日
    浏览(185)
  • Visual Studio Code常用设置

    此处用于记录下本人所使用 VScode 的使用习惯。其中主要包括:界面,主题,光标,文件保存等选项。 基本原理 : Visual Studio Code 会在 windows 的 C 盘中生成一系列配置文件,软件工作时调用该文件所定义的函数执行对应功能。 该文件位于: C盘中的 C:Users20220601-MJAppDataRoa

    2024年01月16日
    浏览(107)
  • Visual Studio Code 下载安装教程(含必备插件)

    点击进入 VSCode 官网:https://code.visualstudio.com/,并点击右侧箭头,选择对应的版本,点击下载(以Windows 版本为例): 等待下载完成: 双击运行 exe 文件,弹出安装界面,勾选【我同意此协议】,点击【下一步】: 自定义修改安装路径,点击【下一步】: 直接点击【下一步】

    2024年02月10日
    浏览(53)
  • Visual Studio Code 编辑器实用插件简介

    以下是一些常用的 Visual Studio Code 编辑器插件及其简短描述: 2gua.rainbow-brackets :在括号周围添加彩虹色的边框,以帮助区分不同层次的括号。 adpyke.codesnap :将代码片段转换为漂亮的图片,以便与其他人分享。 ahmadawais.shades-of-purple :一款紫色主题的 Visual Studio Code 编辑器主题

    2024年02月13日
    浏览(53)
  • 修改『Visual Studio Code(VS Code)』插件默认安装路径的方法

    提示:文章中“『』”符号“加粗”都为着重说明,此二者同时使用一般为输入内容。 作者希望将『Visual Studio Code(以下简称为“ VS Code ”)』的插件安装在 数据盘 (D盘),用于统一管理,因此需要修改VS Code插件 安装路径 。 VS Code插件默认的安装位置为: C:Users{个人用户名

    2024年02月07日
    浏览(66)
  • VS Code 下载安装以及非常好用的插件

    给他家也准备好了安装包:快捷直达 一、下载 进入VS Code官网:地址直达,点击 DownLoad for Windows 下载windows版本 当然也可以点击旁边的箭头,下载Windows版本 或 Mac OS 版本 Stable:稳定版 Insiders:内测版 二、安装 双击安装包,选择 我同意此协议 ,再点击 下一步 选择安装路径

    2024年02月09日
    浏览(46)
  • 【大模型】直接在VS Code(Visual Studio Code)上安装CodeGeeX插件的过程

    【系统环境】Windows11 【工具】手机号或邮箱(用于注册CodeGeeX账号,没有账号是不能使用的) 这个可以自行百度,肯定比我说的全面、客观。 这里说一下我的理解(只针对我要用它干嘛,而不是它全部的用途哦)。 对于我来讲,它主要的用途有两个:代码生成器和智能问答

    2024年04月25日
    浏览(46)
  • Go常见问题(一)Visual Studio Code 无法识别 go 指令

    PS D:… go env go : 无法将“go”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试一次。 所在位置 行:1 字符: 1 go env ~~ CategoryInfo : ObjectNotFound: (go:String) [], CommandNotFoundException FullyQualifiedErrorId : CommandNotFoundExcep

    2024年02月12日
    浏览(90)
  • 在Windows中,如何更改 Visual Studio Code 扩展插件的安装位置?

      Visual Studio Code工具本身就是一种可以免安装的绿色工具,但是其插件(extension)以及用户数据缺省是存储在操作系统的系统目录下的。   虽然已经将Visual Studio Code安装在D盘,但是扩展插件(extension)仍然默认安装在C盘。   Visual Studio Code插件在Windows操作系统的 默认

    2024年02月06日
    浏览(85)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包