VSCode 全称 Visual Studio Code,是微软推出的免费轻量级代码编辑器,支持几乎所有主流编程语言,核心用法就是下载安装之后,通过扩展插件补齐对应语言能力,打开项目文件夹,在编辑器内编写代码运行调试,适合写前端脚本后端代码配置文件等各类开发场景。它本身不是完整 IDE,原生只具备基础文本编辑能力,需要依靠扩展来获得语法高亮代码提示编译调试等进阶功能,这也是很多新手刚上手觉得功能不够用的主要原因,理解这个特点之后,后续所有操作都会更容易上手。
一 前期准备安装
1 进入微软官方网站下载对应系统安装包,支持 Windows Mac Linux 三大系统,根据自己电脑系统选择版本
2 启动安装程序,安装过程中建议勾选添加到 PATH,注册文件关联,添加右键菜单这几个选项,勾选之后可以直接在文件夹右键打开 VSCode,终端也可以直接调用 code 命令启动软件
3 安装完成启动软件,首次打开会进入欢迎页面,可以选择关闭欢迎页,之后就能看到主界面
二 主界面分区介绍
| 区域 | 功能说明 |
|---|---|
| 左侧活动栏 | 资源管理器 搜索 源代码管理 运行调试 扩展,这五个核心图标 |
| 编辑区 | 中间最大区域,用来打开代码文件,支持多标签分屏编辑 |
| 底部状态栏 | 显示当前文件编码 行号列号 语言类型 错误警告 Git 状态 |
| 顶部菜单栏 | 文件 编辑 选择 查看 转到 运行 终端 帮助,所有基础操作入口 |
| 集成终端 | 底部可调出,不用单独开 CMD 或者终端窗口,直接在编辑器里执行命令 |
三 核心基础操作
1 打开项目,推荐方式是文件菜单选择打开文件夹,选择整个项目根目录,资源管理器就会加载全部文件,不要只单独打开单个文件,多文件项目容易出现路径报错
2 新建文件,在资源管理器空白位置右键,选择新建文件,输入文件名后缀,比如 html py js,后缀决定 VSCode 识别的语言类型
3 保存文件,快捷键 Ctrl+S,自动保存可以在设置里开启,避免代码丢失
4 搜索替换,左侧搜索图标可以全局搜索项目内所有代码,支持批量替换
四 扩展插件安装
点击左侧扩展图标,搜索对应语言插件,写 Python 就安装 Python 插件,写前端安装 JavaScript 和 HTML 相关插件,写 C 语言安装 C C++ 扩展。插件安装完成一般需要重启编辑器生效,插件提供语法补全 代码校验 调试器 格式化能力,是 VSCode 最关键的部分。注意不要一次性安装大量插件,插件过多会造成软件卡顿,只保留当前开发需要的插件即可。
五 运行与调试
1 简单脚本可以直接打开集成终端,输入对应运行命令,比如 python main.py,node index.js,这种方式最简单,适合新手
2 调试功能,点击左侧运行调试图标,创建 launch.json 配置文件,配置好程序入口和参数,之后可以设置断点,点击启动调试,逐行查看变量值,排查代码 bug
3 代码格式化,选中代码,使用快捷键 Shift+Alt+F,自动统一代码缩进和排版,前提是已经安装对应语言格式化插件
六 常用快捷键清单
| 快捷键 | 功能 |
|---|---|
| Ctrl+S | 保存文件 |
| Ctrl+Shift+P | 调出命令面板,所有命令都可以在这里搜索执行 |
| Ctrl+F | 当前文件查找 |
| Ctrl+Shift+F | 全局项目查找 |
| Ctrl+` | 打开关闭集成终端 |
| Ctrl+B | 显示隐藏左侧资源栏 |
| F5 | 启动调试 |
| Shift+Alt+F | 代码格式化 |
七 进阶常用配置
打开设置可以修改主题字体大小自动保存行号等基础选项,settings.json 是配置文件,可以手动写入自定义配置,还可以配置 Git 版本控制,左侧源代码管理面板可以提交代码 拉取推送,和远程仓库联动。也可以安装主题插件美化界面,安装代码片段插件,快速生成重复代码模板。
整体来看 VSCode 上手门槛很低,新手先掌握安装打开文件夹 写代码 终端运行这几个基础操作,再逐步学习扩展调试 Git 这些进阶功能,就可以满足日常开发使用。
【常见问题】
问题 1 visualstudiocode 怎么用才能实现中文界面
回答 1 visualstudiocode 怎么用中文界面,只需要打开扩展面板,搜索中文简体语言包插件,安装之后重启编辑器,软件就会切换成中文显示。
问题 2 visualstudiocode 怎么用运行 Python 代码
回答 2 visualstudiocode 怎么用运行 Python 代码,先安装 Python 扩展插件,配置好 Python 解释器路径,之后打开集成终端输入 python 文件名,也可以直接使用调试功能启动运行。
问题 3 visualstudiocode 怎么用出现代码没有提示怎么办
回答 3 visualstudiocode 怎么用解决代码无提示,优先检查对应语言扩展插件是否安装,确认解释器或者语言服务配置正确,重启编辑器,必要时重置插件缓存。
问题 4 visualstudiocode 怎么用和 Git 联动
回答 4 visualstudiocode 怎么用连接 Git,先在电脑安装 Git 程序,打开项目文件夹,左侧源代码管理面板就可以识别仓库,完成提交推送拉取操作。
【免责申明】
本文为 visualstudiocode 基础使用教程,仅作学习参考,软件版本更新后界面和功能可能存在变动,操作请以官方最新版本为准,因自行配置或者操作造成的数据丢失等问题,需要使用者自行承担相关风险。
本文来自作者[洞源漫钞]投稿,不代表大伙搜网立场,如若转载,请注明出处:https://www.dahuoso.com/shubk/202611/664637.html
评论列表(4条)
我是大伙搜网的签约作者“洞源漫钞”!
希望本篇文章《visualstudiocode 怎么用 零基础入门实操指南》能对你有所帮助!
本站[大伙搜网]内容主要涵盖:经验、百科、常识、知识、问答
本文概览:VSCode 全称 Visual Studio Code,是微软推出的免费轻量级代码编辑器,支持几乎所有主流编程语言,核心用法就是下载安装之后,通过扩展插件补齐对应语言能力,打开项目文件夹,在编辑器内编写代码运行调试,适合写前端脚本后端代码配置文件等各类开发场景。它本身不是完整 IDE,原生只具备基础文本编辑能力,需要依靠扩展来获得语法高亮代码提示编译调试等进阶功能,这也是很多新手刚上手觉得功能不够用的主要原因,理解这个特点之后,后续所有操作都会更容易上手。