VS Code + Git 入门教程

📖 本文也提供了独立阅读版本，拥有侧边导航和更好的阅读体验。

很多人第一次听到 Git 的定义，比如什么「分布式版本管理系统」，往往会被这些晦涩的术语搞晕。其实 Git 的核心逻辑非常简单，你可以直接把它理解为一个「游戏存档系统」。

Git：本地的存档系统。你写完一段代码，就相当于打到了一个新的游戏进度。
Commit（提交）：按下「保存游戏」按钮。每次保存，你都要给这个存档起个名字（比如「打完第一个 Boss」或者「修正了登录 Bug」）。
GitHub：游戏云服务器（比如 Steam 云）。
Push（推送）：把你的本地存档上传到云端。这样就算你电脑炸了，也能在别的电脑上找回进度。

1. 准备工作

1.1 安装 VS Code

访问官网：code.visualstudio.com
下载并安装。在安装过程中，务必勾选以下两个选项，方便你直接在文件夹右键打开代码：
- ✅ 将”通过 Code 打开”操作添加到文件上下文菜单
- ✅ 将”通过 Code 打开”操作添加到目录上下文菜单

1.2 安装 Git

访问官网：git-scm.com/downloads
下载 Windows 版本。
安装重点：在选择默认编辑器时，推荐从下拉菜单中选择 Visual Studio Code，而不是默认的 Vim。Vim 对于初学者来说比较难操作。
在配置初始分支名时，建议选择 Override the default branch name for new repositories，并填入 main。
安装完成后，打开终端输入 git --version，看到版本号即表示成功。

2. 必做的初始配置

Git 在你第一次存档时，需要知道「这个档是谁存的」。如果你跳过这一步，后续提交代码会直接报错。

你需要打开 VS Code 的终端（Terminal），依次输入以下两条命令：

1 2	git config --global user.name "你的用户名" git config --global user.email "你的邮箱@example.com"

💡 建议这里的用户名和邮箱与你之后注册的 GitHub 账号保持一致。

3. 注册 GitHub 账号

访问 github.com 并点击 Sign up。
GitHub 就是你的「云端存档仓库」。在这里存代码不仅可以备份，还能让别人看到你的作品。

4. 开始你的第一个项目

4.1 创建文件夹

在桌面创建一个文件夹，比如 my-git-demo，然后直接把它拖进 VS Code。

4.2 编写代码

新建一个 index.html 或 hello.py。随便写点内容并保存。

4.3 初始化本地存档（git init）

点击 VS Code 左侧侧边栏那个像「分支」一样的图标（源代码管理/Source Control）。

你会看到一个 Initialize Repository（初始化仓库） 的按钮。点击它。这相当于在这个文件夹里安装了一个「存档插槽」。

5. 保存第一个存档（Commit）

初始化后，VS Code 会列出你刚才创建的文件。

在顶部的消息框（Message）里输入存档名字，比如 first save。
点击 Commit（提交） 按钮。
如果是第一次操作，VS Code 可能会问你要不要自动暂存所有更改，点击 Always（总是） 即可。

此时，你的代码就已经在本地存好档了。

6. 查看存档进度（Graph）

推荐安装 VS Code 的相关插件（或者使用内置的 Source Control Graph 面板），你可以直观地看到：

绿色的线：代表你新增的代码。
红色的线：代表你删除的代码。
节点：每一个节点就是一个存档。你可以随时点开，对比两个存档之间到底改了哪几行。

7. 将存档同步到云端（Push）

现在存档只在你自己的电脑上。我们要把它传到 GitHub 云端。

7.1 方法一：直接从 VS Code 发布（最快）

在源代码管理面板点击 Publish to GitHub 按钮。

OAuth 授权：浏览器会弹出页面，询问是否允许 VS Code 访问 GitHub 账号。点击 Authorize 允许。
选择公开/私有：
- Public（公开）：全世界都能看到你的代码。
- Private（私有）：只有你自己（和你邀请的人）能看到。
发布成功后，你会发现存档节点旁边多了一个「云朵」图标，这代表本地和云端已经同步。

7.2 方法二：先在 GitHub 建库（更专业）

如果你想给仓库起个不一样的名字，可以这么操作：

在 GitHub 首页点击右上角 + -> New repository。
填入名字（比如 custom-project-name），点击 Create。
在 VS Code 中点击源代码管理面板顶部的三个点 ... -> Remote（远程） -> Add Remote（添加远程仓库）。
选择 Add remote from GitHub，找到你刚才建好的那个名字，选中它。
起个别名（比如 origin 或 github），最后点击底部的 Publish 或 Sync。

8. 国内用户必读：配置网络代理

由于网络环境原因，国内用户在推送（Push）到 GitHub 时经常会遇到连接超时的情况。如果你发现进度条一直转不动，可以在终端输入以下命令设置代理（假设你的代理工具端口是 7890）：

# 设置 HTTP 代理
git config --global http.proxy http://127.0.0.1:7890

# 设置 HTTPS 代理
git config --global https.proxy http://127.0.0.1:7890

⚠️ 注意：端口号（7890）需要根据你自己的代理软件实际设置来修改。

9. 什么是本地与云端的「进度偏差」？

当你又写了一些代码并做了本地 Commit，但还没执行 Push 时，你会发现：

本地指针（main）：已经跑到了最新的存档。
云端指针（origin/main）：还停留在上一次推送的位置。

这就是「本地领先于云端」。你只需要点击 Sync Changes（同步更改），Git 就会把中间差的那几个存档全部推上去，让云端追上你的进度。

10. 进阶必备：.gitignore

并不是所有文件都要上传到云端。比如 Python 的缓存文件、VS Code 的配置、或是包含密码的 .env 文件。

在项目根目录新建一个 .gitignore 文件，写在里面的文件会被 Git 自动忽略：

# 忽略 Python 缓存
__pycache__/
*.pyc

# 忽略本地配置
.vscode/

# 忽略系统杂质
.DS_Store
Thumbs.db

11. 常用 Git 命令速查表

虽然 VS Code 的图形界面已经涵盖了 90% 的操作，但了解这些命令能让你在出问题时更从容：

动作	命令行	VS Code 对应操作
初始化	`git init`	点击 Initialize Repository 按钮
查看状态	`git status`	查看侧边栏文件列表
存入暂存区	`git add .`	点击文件旁的 + 号
保存存档	`git commit -m "消息"`	输入消息并点击 Commit 按钮
传到云端	`git push`	点击 Sync Changes 或推送按钮
从云端拉取	`git pull`	点击同步按钮
克隆项目	`git clone [URL]`	在命令面板输入 Git: Clone
查看历史	`git log`	查看 Source Control Graph 面板