【超详细】VSCode连接GitHub全攻略：上传/克隆代码一步到位

一、前言

• 为什么要用VSCode + GitHub？

  • GitHub：全球最大代码托管平台，支持版本控制和协作开发

  • VSCode：轻量级代码编辑器，内置Git支持，无缝集成GitHub

• 适用场景：个人项目管理、团队协作、开源贡献

---

二、准备工作

1. 注册GitHub账号

• 访问 GitHub官网 注册账号

• 验证邮箱（重要！否则无法推送代码）

2. 安装必要工具

• VSCode ：官网下载

• Git ：官网下载

  • 安装时勾选 "Add Git to PATH"

3. 配置Git全局信息（必做！）

git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"

验证配置：

git config --global --list

---

三、连接GitHub与VSCode

方法1：HTTPS协议（适合新手）

1. 在VSCode中登录GitHub

   • 安装扩展 GitHub Pull Requests and Issues

   • 按 Ctrl+Shift+P 输入 GitHub: Sign in，选择浏览器授权

2. 克隆仓库

   • 点击VSCode左侧活动栏的 源代码管理图标 → 克隆存储库

   • 输入GitHub仓库HTTPS地址（如 https://github.com/用户名/仓库名.git）

方法2：SSH协议（更安全，免密码）

1. 生成SSH密钥

   ssh-keygen -t ed25519 -C "your_email@example.com

2. 将公钥添加到GitHub

   复制公钥内容：
   
   cat ~/.ssh/id_ed25519.pub
   GitHub → Settings → SSH and GPG keys → New SSH Key

3. 测试连接

   ssh -T git@github.com

   看到 Hi 用户名! 表示成功

---

四、实战操作：上传与克隆代码

1. 克隆仓库到本地

git clone git@github.com:用户名/仓库名.git

或通过VSCode直接克隆：
Ctrl+Shift+P → Git: Clone

2. 上传代码到GitHub

• 步骤1：初始化本地仓库

  git init
  git remote add origin https://github.com/用户名/仓库名.git

• 步骤2：提交并推送

  git add .
  git commit -m "首次提交"
  git push -u origin main

3. 同步远程更新

git pull origin main

或通过VSCode界面点击 源代码管理面板的同步按钮

---

五、常见问题解决

1. 推送失败：权限被拒绝

• HTTPS协议：更新凭据

  git config --global credential.helper manager-core

• SSH协议：检查密钥是否添加正确

2. 合并冲突

• 冲突文件会包含 <<<<<<< 标记

• 手动修改后执行：

  git add 冲突文件
  git commit -m "解决冲突"

3. 错误：fatal: refusing to merge unrelated histories

强制合并不相关历史：

git pull origin main --allow-unrelated-histories

---

六、效率技巧

1. VSCode快捷键

   • Ctrl+Shift+G：打开Git面板

   • Ctrl+Shift+P：快速执行Git命令

2. Git图形化操作

   • 右键文件 → "暂存更改"

   • 提交历史中右键提交 → "撤销提交"

3. .gitignore文件

   忽略无需上传的文件（如 node_modules/）

---

七、结语

• 通过本文，你已掌握VSCode与GitHub的完整协作流程。

• 遇到问题？欢迎在评论区留言！

相关推荐：

• GitHub Actions自动化部署教程

• VSCode必装插件推荐