vscode全网最详细使用教程

article/2025/9/22 18:22:36

vscode下载地址

官网下载:https://code.visualstudio.com/或者直接点击**我的资源**下载

VScode使用教程

安装教程

鼠标左键双击,即可运行安装程序

一:同意协议
在这里插入图片描述

二:选择安装路径
在这里插入图片描述

很明显可以看到VSCode的默认安装路径为C:\users\用户名\AppData\Local\Programs\Microsoft VS Code

你可以对其进行修改:

  • 点击浏览按钮
  • 或者 直接在输入框中删掉默认路径,然后进行填写(注意:请使用英文输入法)

三:在开始菜单文件夹中创建VSCode的快捷方式
在这里插入图片描述

  • 你可以选择更改开始菜单文件夹名字
  • 或者不创建开始菜单文件夹
  • 这一步无论你如何选择,实际上几乎不影响你使用VS Code

开始菜单文件夹就是:
在这里插入图片描述

安装完成后,键盘上点击 win ,你会明白的

四:一些很有用的设置
在这里插入图片描述

这些选项勾选后的效果如下:

  • **效果一:**创建桌面快捷方式

桌面上将出现该VSCode的快捷方式
img

  • **效果二:**将“通过Code打开”操作添加到 Windows 资源管理器文件上下文菜单

选中任意文件,点击鼠标右键
在这里插入图片描述

可以直接通过VSCode打开该文件

  • **效果三:**将“通过Code打开”操作添加到 Windows 资源管理器目录上下文菜单

选中任意文件夹,点击鼠标右键
在这里插入图片描述

可以直接通过VSCode打开该文件夹

将VS Code的打开操作添加到文件、文件夹的右键菜单中,会给我们的操作带来极大的方便

  • **效果四:**将Code注册为受支持的文件类型的编辑器

对于受支持文件类型的文件,可以右键 > 打开方式 > Visual Studio Code

来用VSCode打开该文件

  • **效果五:**添加到PATH

将VSCode添加到环境变量Path中,可以在控制台(cmd或power shell)中输入code打开VS Code

或者输入

code .

将会在VSCode中打开该文件夹(控制台中显示的路径)

五:等待安装完成
在这里插入图片描述

六:安装完成
在这里插入图片描述

选择是否立即打开VS Code

使用教程

1、创建一个空文件夹,作为项目目录

在这里插入图片描述

2、打开vscode,在文件中选择【打开文件夹】,当然,我们也可以直接将文件夹拖进vscode编辑器

在这里插入图片描述

3、在左侧的“资源管理器”能看见我们的项目文件夹,右键它,新建一个html文档

在这里插入图片描述

4、我们输入半角感叹号 ! ,接着按下tab键,它将自动生成一个html结构

在这里插入图片描述

5、可以在body里编写我们自己的代码
在这里插入图片描述

安装插件

VSCode汉化

在这里插入图片描述

常用插件(安装步骤同汉化)

  • Auto Close Tag (自动闭合HTML/XML标签)
  • Auto Rename Tag (自动完成另一侧标签的同步修改)
  • Beautify (格式化 html ,js,css)
  • Bracket Pair Colorizer(给括号加上不同的颜色,便于区分不同的区块)
  • HTML CSS Support (智能提示CSS类名以及id)
  • HTML Snippets(智能提示HTML标签,以及标签含义)
  • open in browser(右键快速在浏览器中打开html文件)
  • Path Intellisense(自动提示文件路径)
  • Class autocomplete for HTML(智能提示HTML class =“”属性)

点关注,不迷路,安装了vscode如果想深入学习请点击vscode全网最详细使用教程(下)


http://chatgpt.dhexx.cn/article/wwoTSiP6.shtml

相关文章

VScode 详细教程

一、VScode 安装 VScode 官网地址:https://code.visualstudio.com/ 你也可以打开下载页面 https://code.visualstudio.com/download,下载想要的格式包: 安装过程较为简单,略过。 二、界面说明 以下是 VScode 启动后的界面&…

VSCode 入门操作大全 + 实用插件推荐【零基础专属详细教程】

📀 前言: 🎫 选择一个好的开发工具很重要,很多刚学编程的小伙伴在 webstorm 和 vscode 上很难抉择,我个人更喜欢使用 vscode,因为其有着简洁的操作风格和丰富的人性化的各种功能,这篇文章带给大…

前端基础从头学——VsCode使用教程+html基础(入门篇)

作者简介:hello!大家好,初学前端知识,请多多指教。 希望我的分享能够帮助到更多的人,如果觉得我的分享有帮助的话,请大家一键三连支持一下哦~ 文章目录 前言 一、VsCode编辑器使用教程1、VsCode的下载与安装…

VScode使用教程(菜鸟版)

1.VScode是什么? Visual Stdio Code简称VS Code,是一款跨平台的、免费且开源的现代轻量级代码编辑器,支持几乎 主流开发语言的语法高亮、智能代码补全、自定义快捷键、括号匹配和颜色区分、代码片段提示、代码对比等特性,也拥有对…

Visual Studio Code 入门教程

一、入门教程 1.1 简介 Visual Studio Code ,简称 VSCode。它是一款由微软开发且跨平台的轻量级但功能强大的免费源代码编辑器。该软件支持语法高亮、代码自动补全、代码重构、查看定义功能,并且内置了命令行工具和 Git 版本控制系统。用户可以更改主题…

PyTorch 手把手教你实现 MNIST 数据集

PyTorch MNIST 实现 概述获取数据网络模型train 函数test 函数main 函数完整代码 概述 MNIST 包含 0~9 的手写数字, 共有 60000 个训练集和 10000 个测试集. 数据的格式为单通道 28*28 的灰度图. 获取数据 def get_data():"""获取数据"""# 获取…

连续学习入门(三):Permuted MNIST/Split MNIST/Sequential MNIST 数据集

说明:本系列文章若无特别说明,则在技术上将 Continual Learning(连续学习)等同于 Incremental Learning(增量学习)、Lifelong Learning(终身学习),关于 Continual Learni…

导入mnist数据集

下载一个代码后,发现需要导入mnist数据集,首先新建一个py的文件,把代码复制过来,然后记得一定要改成这样的格式: from tensorflow.examples.tutorials.mnist import input_data mnist input_data.read_data_sets(MNI…

【MNIST】

1. Normal Neural Network: 首先我用的是两层(input layer 和 output layer)的feed-forward的神经网络结构来训练数据, y wx b, 在输出层用的是softmax求概率,算loss用的是交叉熵的办法,选用梯度下降法来最小化loss…

MNIST数据集使用详解

数据集下载网址:http://yann.lecun.com/exdb/mnist/ 下载后无需解压,将其放在一个文件夹下即可: 数据说明: 数据集常被分为2~3个部分 训练集(train set):用来学习的一组例子,用来适应分类器的参数[即权重]…

详解 Pytorch 实现 MNIST

MNIST虽然很简单,但是值得我们学习的东西还是有很多的。 项目虽然简单,但是个人建议还是将各个模块分开创建,特别是对于新人而言,模块化的创建会让读者更加清晰、易懂。 CNN模块:卷积神经网络的组成;trai…

十分钟搞懂Pytorch如何读取MNIST数据集

前言 本文用于记录使用pytorch读取minist数据集的过程,以及一些思考和疑惑吧… 正文 在阅读教程书籍《深度学习入门之Pytorch》时,文中是如此加载MNIST手写数字训练集的: train_dataset datasets.MNIST(root./MNIST,trainTrue,transform…

torchvision中datasets.MNIST介绍

用法介绍 torchvision中datasets中所有封装的数据集都是torch.utils.data.Dataset的子类,它们都实现了__getitem__和__len__方法。因此,它们都可以用torch.utils.data.DataLoader进行数据加载。以datasets.MNIST类为例,具体参数和用法如下所示…

万物皆用MNIST---MNIST数据集及创建自己的手写数字数据集

刚刚接触到人工智能的我们,必定会遇到一个非常非常非常熟悉的朋友------MNIST 这是一套流行的手写数字图片,常常被用来测试我们的思想和算法。这个数据集称为手写数字的MNIST数据库,从研究员Yann LeCun 的网站,可以得到这个…

Pytorch 之 MNIST 数据集实现

目录 1. 数据集介绍2. 代码2. 读代码(个人喜欢的顺序)2.1. 导入模块部分:2.2. Main 函数: 1. 数据集介绍 一般而言,MNIST 数据集测试就是机器学习和深度学习当中的"Hello World"工程。几乎是所…

MNIST数据集手写数字识别(CNN)

🔎大家好,我是Sonhhxg_柒,希望你看完之后,能对你有所帮助,不足请指正!共同学习交流🔎 📝个人主页-Sonhhxg_柒的博客_CSDN博客 📃 🎁欢迎各位→点赞…

MNIST数据集详解及可视化处理(pytorch)

MNIST数据集详解及可视化处理(pytorch) MNIST 数据集已经是一个被”嚼烂”了的数据集, 作为机器学习在视觉领域的“hello world”,很多教程都会对它”下手”, 几乎成为一个 “典范”。 不过有些人可能对它还不是很了解, 下面来介绍一下。 MN…

Mnist数据集介绍

Mnist数据集已经是一个被"嚼烂"了的数据集了,很多关于神经网络的教程都会对它下手。因此在开始深度学习之前,先对这个数据集介绍一下。 Mnist数据集图片格式介绍 Mnist数据集分为两部分,分别含有60000张训练图片和10000张测试图片…

使用MNIST数据集

首先,必须向各位强调的是:该数据集名字叫MNIST,而非MINIST~ 我之前就一直弄错了! 哈哈~ 网上有很多使用MNIST数据集的教程,要么太麻烦,要么需要翻墙下载,很慢。 在这里分…

Fashion MNIST进行分类

🔎大家好,我是Sonhhxg_柒,希望你看完之后,能对你有所帮助,不足请指正!共同学习交流🔎 📝个人主页-Sonhhxg_柒的博客_CSDN博客 📃 🎁欢迎各位→点赞…