首页 > 其他分享 >VsCode安装

VsCode安装

时间:2024-05-22 15:51:07浏览次数:25  
标签:插件 Vue VsCode 点击 VS Code 安装

一、下载

进入VS Code官网:https://code.visualstudio.com,点击 DownLoad for Windows下载windows版本

image-20220913194205681

当然也可以点击旁边的箭头,下载Windows版本 或 Mac OS 版本

image-20220913194235945

  • 备注:
    • Stable:稳定版
    • Insiders:内测版

注意:上述下载软件安装包的过程,大家可以不用操作,因为在提供的课程资料中,已经为大家准备好了安装包 。

二、安装

双击安装包,选择我同意此协议,再点击下一步

image-20220522162046996

选择安装路径(也可以使用默认值: C:\Users\super\AppData\Local\Programs\Microsoft VS Code),点击下一步

image-20220522162201640

继续点击下一步

image-20220522162315843

可以勾选创建桌面快捷方式,如果不想使用vscode作为代码默认打开方式,可以取消将code注册为受支持的文件类型的编辑器,点击下一步

image-20220522162528751

点击安装,开始安装

image-20220522162606538

image-20220522162623828

image-20220522162633671

安装完成,运行VS Code。

image-20220522163326948

点击左下角的 "设置" -> "主题" -> "主题颜色",然后可以根据自己的喜好,选择喜欢的主题颜色。

1695890302551

三、VS Code插件安装

image-20220812153551951

VS Code提供了非常丰富的插件功能,根据你的需要,安装对应的插件可以大大提高开发效率。

完成前端开发,常见插件介绍:

1、Chinese (Simplified) Language Pack

适用于 VS Code 的中文(简体)语言包

image-20220522163955686

2、HTML CSS Support

在编写样式表的时候,自动补全功能大大缩减了编写时间。

image-20220522164137867

3、JavaScript (ES6) code snippets

支持ES6语法提示

image-20220522164226989

4、Mithril Emmet

一个能大幅度提高前端开发效率的一个工具,用于补全代码

image-20220522164445770

5、Path Intellisense

路径提示插件

image-20220522164542982

6、Vue 3 Snippets

在 Vue 2 或者 Vue 3 开发中提供代码片段,语法高亮和格式化的 VS Code 插件,能极大提高你的开发效率。

image-20220522164651541

7、Auto Close Tag

自动闭合HTML/XML标签

image-20220522183524341

8、Auto Rename Tag

自动完成另一侧标签的同步修改

image-20220522183633805

9、open in browser

vscode不像IDE一样能够直接在浏览器中打开html,而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件,支持自定义打开指定的浏览器,包括:Firefox,Chrome,Opera,IE以及Safari

image-20220522183954255

10、Live Server

一个具有实时加载功能的小型服务器,也就是说我们可以在项目中实时用live-server作为一个实时服务器实时查看开发的网页或项目效果。

1695890166206

11、Vue Language Features (Volar)

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

1695890193811

12、TypeScript Vue Plugin (Volar)

TypeScript Vue Plugin是一个对Vue.js框架进行扩展的插件,它允许开发者使用TypeScript语言编写Vue组件和应用程序,并提供了更好的类型检查和编辑器支持。通过使用TypeScript Vue Plugin,开发者可以在编写Vue应用时获得更好的开发体验和代码可维护性。

1695890214795

13、File Utils

File Utils插件,可以方便快捷的来创建、复制、移动、重命名文件和目录。

1695890235583

14、IntelliJ IDEA Keybindings

安装VSCode的插件 IntelliJ IDEA Keybindings 即可在VSCode中使用IDEA的快捷键。

1695890257098

四、VS Code 配置

打开配置面板,根据自己的喜好,可以修改字体、背景样式等偏好设置

image-20220522165758191

标签:插件,Vue,VsCode,点击,VS,Code,安装
From: https://www.cnblogs.com/NorthPoet/p/18206449

相关文章

  • git码云安装及使用菜鸟教程
    1.下载Windows本地码云https://mirrors.huaweicloud.com/git-for-windows/(华为镜像下载),选择合适的版本下载,此处下载速度要快些2.登录码云官网https://gitee.com/,并设置对应的仓库: 2.Windows本地安装后,进入对应目录,右键,会出现Opengitbashhere,按码云仓库的提示进行设置,如下......
  • 在非小米电脑上安装小米电脑管家
    记录一下今天突然发现之前的小米妙享用不了百度了一下才知道澎湃上线后这玩意儿好像就没用了;所以找了一圈替代品,发现了小米电脑管家这个东西内置了HyperConnect跨端智联,但是这玩意儿又不能直接安装,又找了一圈怎么安装;原文链接:非小米电脑安装小米电脑管家-雪饼(xue6ing.cn)......
  • PYENV安装与使用
    1.概述pyenv是一个python的版本管理软件,通过他,我们可以方便的安装python的版本,切换版本,解决版本不同带来问题。2.安装pyenv我们可以通过链接下载pyenvhttps://github.com/pyenv-win/pyenv-win/archive/master.zip配置pyenv下载软件后,我们可以文件解压到本地比如:D:\pro......
  • 帆软——安装报表调试助手
    1.安装报表调试助手服务器-插件管理 搜索报表调试助手-安装 2.安装完成后,运行报表,在报表的右侧会出现SQL图标 3.查询后,点击图标查看对应的sql ......
  • python环境安装
    python环境安装分三步,下载、安装、验证。一、python包下载python包下载地址python.org。本例程下载3.8.10版本,据说3.8版本较为稳定。最新版本点击黄色按钮可直接下载,如果想要下载历史版本则找到所想要选择的历史版本点击进入,在所进入页面的最下方存放有下载资源。位置如下图所......
  • Linux实验(安装内核)
    Linux实验(安装内核)以下所有操作皆以机房电脑上的虚拟机为基础环境下载链接:Linux课程机房虚拟机#‍预备工作:打开虚拟机->设置->添加​,选择硬盘后点击下一步,全部都是默认选项​​新建磁盘后需要重启虚拟机,然后执行以下命令‍装载磁盘fdisk/dev/sdb更新分区par......
  • CentOS7.9安装mysql-8.0.36踩坑小记
    前言:最近想在一台测试服务器上,安装下最新的MySQL8.0版本数据库,想着挺简单的一件事,之前也手搓过8.0安装,这不手到擒来,没想到马失前蹄,遇到了一个小坑,耗费了不少时间,简单写篇文档记录下吧。1.排错记录执行./mysqld--initialize初始化命令后,提示报错,如下图所示看报错应该是......
  • linux supervisor 安装使用
    目录linuxsupervisor安装使用安装配置文件其他参数详情启动supervisor其他命令添加被守护的进程java案例python案例vue3+ts案例redis案例tomcat案例守护进程其他参数详情linuxsupervisor安装使用supervisor与systemd不同,systemd的作用是将服务管理起来,方便开机自启动,或者启......
  • 文件加密软件有什么用?企业必须安装么?
    文件加密软件在企业中的应用是为了加强信息安全管理,保障核心资料的安全。这种软件的核心功能是对企事业单位的文件进行加密,使得无权限人员即使获取了文件也无法阅读内容,有效防止信息泄露。那么,文件加密软件到底有何用处,企业必须使用吗?让我们一探究竟。 文件加密软件的用处......
  • 夜莺nightingale的安装与启动
    使用二进制安装https://flashcat.cloud/docs/content/flashcat-monitor/nightingale-v7/install/binary/下载地址https://flashcat.cloud/download/nightingale/需要提前安装mysql与redis解压tar包,在etc/config.toml中修改mysql和redis的链接配置信息也可以配置日志信息[Log......