Visual Studio Code 安装教程附插件推荐

举报
Yeats_Liao 发表于 2022/10/20 21:46:05 2022/10/20
【摘要】 Visual Studio Code (简称 VSCode / VSC) 是微软旗下一款非常优秀的跨平台代码编辑软件,我通过学习相关VSCode视频,做一个入门总结来帮助大家 1 VSCode下载及安装 1.1 下载详见:https://code.visualstudio.com/官网会根据你的系统自动判断下载版本VSCode默认提供的User Installer版,大多数人都是用的这个版本...

Visual Studio Code (简称 VSCode / VSC) 是微软旗下一款非常优秀的跨平台代码编辑软件,我通过学习相关VSCode视频,做一个入门总结来帮助大家

1 VSCode下载及安装

1.1 下载

详见:https://code.visualstudio.com/

在这里插入图片描述
官网会根据你的系统自动判断下载版本在这里插入图片描述
VSCode默认提供的User Installer版,大多数人都是用的这个版本,当然你也可以自己下载相关版本

  • User Installer版:会安装在当前计算机帐户目录,意味着如果使用另一个帐号登陆计算机将无法使用别人安装的vscode
  • System Installer版(建议使用):安装在非用户目录,例如C盘根目录,任何帐户都可以使用

1.2 安装

安装步骤具体讲这一步:
在这里插入图片描述

  • 将“通过code 打开“操作添加到windows资源管理器文件上下文菜单

  • 将“通过code 打开”操作添加到windows资源管理器目录上下文菜单

说明:可以对文件,目录点击鼠标右键,选择使用 VScode 打开

  • 将code注册为受支持的文件类型的编辑器

说明:默认使用 VScode 打开诸如 txt,py等文本类型的文件,让支持的代码文件全部变成VScode默认打开,一般建议不勾选。

  • 添加到PATH(重启后生效)

说明:这步骤默认的,勾选上,不用配置环境变量,可以直接使用。

1.3 界面介绍

在这里插入图片描述
1.活动栏从上到下依次为

  • 文件资源管理器:浏览和管理文件和文件夹
  • 跨文件搜索:在当前文件夹内进行跨文件的搜索
  • 源代码管理:对当前文件夹下的代码进行版本管理
  • 启动和调试:对当前文件夹下的项目进行运行和调试
  • 管理拓展:下载和管理 VS Code 里的插件
  • (项目管理器:此为插件)

2.侧边栏

  • 浏览和管理文件和文件夹

3.编辑栏

  • 编写代码的区域

4.面板栏从左到右依次为

  • 问题面板(ProblemsPanel)展示当前文件夹下代码里的所有问题和警告

  • 输出面板(Output Panel)看到作对应的 Git 命令行以及它的运行结果/

  • 调试控制台(Debug Console) 调试代码

  • 终端(Terminal) 集成终端的存在

5.状态栏

  • 光标在几行几列、缩进、编码格式等信息
    在这里插入图片描述

2 编辑器常用功能

参考:https://www.cnblogs.com/jpfss/p/10956650.html

在这里插入图片描述

2.1 基础编辑 Basic editing

在这里插入图片描述
在这里插入图片描述

2.2 导航 Navigation

在这里插入图片描述

2.3 搜索和替换 Search and replace

在这里插入图片描述

2.4 多光标和选择 Multi-cursor and selection

在这里插入图片描述

2.5 丰富的语言编辑 Rich languages editing

在这里插入图片描述

2.6 编辑器管理 Editor management

在这里插入图片描述

2.7 文件管理 File management

在这里插入图片描述

2.8 显示 Display

在这里插入图片描述

2.9 调试 Debug

在这里插入图片描述

2.10 集成终端 Integrated terminal

在这里插入图片描述

3 插件推荐

3.1 汉化 – Chinese

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
点击重启即可

3.2 主题设置 – Better Solarized

护眼主题,推荐
在这里插入图片描述
安装完之后可以点左下角的设置中颜色主题
在这里插入图片描述
按上下键可以预览切换的主题
在这里插入图片描述

3.3 图标设置 – vscode-icons

与主题设置同理,让文件图标更有区分度
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

3.4 运行代码 – Code Runner

在这里插入图片描述

3.5 页面调试 – open in browser

在这里插入图片描述

3.6 添加文件或文件夹到gitignore – gitignore

在这里插入图片描述

3.7 项目管理工具 --Project Manager

在这里插入图片描述

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。