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 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/55756.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Day12-1-Webpack前端工程化开发

Webpack前端工程化 1 案例-webpack打包js文件 1 在index.html中编写代码 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><me…

学生管理系统(升级版)

import java.util.ArrayList; import java.util.Random; import java.util.Scanner;public class Demo_学生管理系统 {public static void main(String[] args) {ArrayList<User> list new ArrayList<>();Scanner sc new Scanner(System.in);while (true) {Syste…

基于ARM+FPGA (STM32+ Cyclone 4)的滚动轴承状态监测系统

状态监测系统能够在故障早期及时发现机械设备的异常状态&#xff0c;避免故障的 进一步恶化造成不必要的损失&#xff0c;滚动轴承是机械设备的易损部件&#xff0c;本文对以滚动 轴承为研究对象的状态监测系统展开研究。现有的监测技术多采用定时上传监 测数据&#xff0c;…

chaitin-Nginx+Docker

Nginx实战 任务一 1、源码包安装NGINX A&#xff0c;搭建Web Server&#xff0c;任意HTML页面&#xff0c;其8080端口提供Web访问服务&#xff0c;截图成功访问http(s)&#x1f615;/[Server1]:8080并且回显Web页面 官网地址&#xff1a;http://nginx.org/en/download.html 步骤…

【开源项目--稻草】Day03

【开源项目--稻草】Day03 1. 续Spring-Security1.1 自定义登录界面 2. 用户注册2.1 将注册页面显示2.2 编写控制器进行测试2.3 编写注册业务逻辑2.4 注册功能的收尾 3. VUE3.1 VUE的基本使用3.1.1 什么是VUE 3.2 使用VUEAjax完善稻草问答的注册功能 1. 续Spring-Security 1.1 …

springboot+vue超市进销存管理系统_91crh

表名&#xff1a;zengsongxinxi 功能&#xff1a;赠送信息 字段名称 类型 长度 字段说明 主键 默认值 id bigint 主键 主键 addtime timestamp 创建时间 CURRENT_TIMESTAMP shangpinmingcheng varchar 200 商品名称…

如何在IDEA中启动多个SpringBoot服务实例

文章目录 一、前言&#xff1a;二、IDEA版本&#xff1a;三、Allow parallel run 模式&#xff1a;四、解决方案&#xff1a; 一、前言&#xff1a; 在IDEA中&#xff0c;"Allow parallel run"是一个配置选项&#xff0c;用于指定是否允许并行运行多个相同的启动配置…

uniapp使用阿里图标

效果图&#xff1a; 前言 随着uniApp的深入人心&#xff0c;我司也陆续做了几个使用uniapp做的移动端跨平台软件&#xff0c;在学习使用的过程中深切的感受到了其功能强大和便捷&#xff0c;今日就如何在uniapp项目中使用阿里字体图标的问题为大家献上我的一点心得&#xff0…

triangles parallel lines

三角形与平行线 如何把现实问题或者抽象问题图形化呢。 梯形面积&#xff1a;四边形面积是如何从三角形面积转换而来的呢&#xff0c;数学里面作图其实蛮重要的&#xff0c;作图的好坏关系到是否能够更加直观明了展现关系&#xff0c;例如为什么有时候三角形&#xff0c;梯形要…

LNMP及论坛搭建(第一个访问,单节点)

LNMP&#xff1a;目前成熟的一个企业网站的应用模式之一&#xff0c;指的是一套协同工作的系统和相关软件 能够提供静态页面服务&#xff0c;也可以提供动态web服务&#xff0c;LNMP是缩写 L&#xff1a;指的是Linux操作系统。 N&#xff1a;指的是nginx&#xff0c;nginx提…

react icon ant简单使用

refer&#xff1a; 文字提示 Tooltip - Ant Design 1.首先保证已经引入了Ant 2.在组件&#xff08;页面&#xff09;引入tooltip import { Form, Tooltip } from antd; 3.在合适的位置使用tooltip&#xff1a; <span>寿命 <Tooltip title"这是寿命的说明&quo…

Vue系列第七篇:Element UI之el-main,el-table,el-dialog,el-pagination,el-breadcrumb等控件使用

本篇实现主页面功能&#xff0c;包括主页面排版布局&#xff0c;学生管理模块实现&#xff0c;后台接口实现等功能。 目录 1.运行效果 1.1登录页面 1.2主页面 1.3学生管理 - 信息列表 1.4学生管理 - 信息管理 1.5学生管理 - 作业列表 1.6学生管理 - 作业管理 2.前端代码…