尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

用 Visual Studio Code 完成首次开源贡献:first-contributions 图形化入门指南

用 Visual Studio Code 完成首次开源贡献:first-contributions 图形化入门指南 文档教程开源治理【免费下载链接】first-contributions✨ Help beginners to contribute to open source projects项目地址https://gitcode.com/gh_mirrors/fi/first-contributions点击查看免费下载本指南基于 first-contributions 项目官方文档 github-windows-vs-code-tutorial_pt_br.md巴西葡萄牙语版及其英文原版 github-windows-vs-code-tutorial.md 编写。该项目旨在简化并引导初学者完成人生第一次开源贡献如果你不习惯命令行官方 README 也明确建议参考这套基于 GUI 工具的教程见 README.md。读完本文你将完全使用 Visual Studio Code 图形界面零命令行完成fork → clone → 创建分支 → 修改文件 → commit → push → Pull Request的完整贡献流程。为什么用图形界面完成第一次贡献万事开头难尤其是协作时犯错总会让人不适但开源的本质就是协作与共同工作。阅读文章和观看教程固然有帮助但远不如在不搞砸任何东西的前提下亲自动手一次。first-contributions 项目提供的就是一条安全练手路径它不要求你先掌握全部 Git 命令而是让你在真实的仓库上走完一遍标准贡献流程。本项目仓库中大部分教程都面向 CLI 用户例如 README.md 中的git clone、git switch -c等命令式操作而本教程对应的 github-windows-vs-code-tutorial.md 则是面向不想碰命令行的开发者——所有操作都通过 VS Code 的图形界面与命令面板完成。两套教程指向同一个目标文件 Contributors.md结果等价这正是本项目的设计意图无论你用哪种工具都能完成第一次真实贡献。运行环境说明官方教程基于Windows 10 Visual Studio Code 1.27.2录制后续步骤中会用到键盘快捷键它们在 macOS / Linux 以及不同键盘布局UK、DE 等下可能不同。你可以随时在 VS Code 命令面板中搜索 shortcuts快捷键查看当前环境的键位列表。前置条件安装 Visual Studio Code如果机器上还没有安装 VS Code请先前往官方下载页安装。此外本教程依赖 VS Code 内置的 Git 集成能力因此建议同时确认本机已安装 Git且 VS Code 能识别到git可执行文件Windows 下通常随 Git for Windows 一起配置好。第一步Fork 这个仓库进入 first-contributions 的仓库主页点击页面右上角的Fork按钮即可在你的 GitHub 账户中创建该仓库的一份副本。理解 Fork 的语义很重要GitHub 会持续记录你的仓库与你 Fork 的来源仓库之间的关系可以把你的副本理解为一个工作副本working copy。大多数顶层仓库即不是从其他仓库 Fork 而来的仓库只有一个小型核心团队能直接提交改动其他所有贡献者都必须先 Fork在副本上修改再通过 Pull Request 请求把改动合并回顶层仓库。如果仓库管理员认可你的改动并将其合并你的贡献就正式进入项目了。从仓库结构看Fork 机制是 README.md 与 Contributors.md 协作模式的根基——Contributors.md中数千行贡献者名单正是通过无数个 Fork PR 累积出来的。第二步克隆你的仓库注意别克隆错Fork 之后下一步是把你自己的副本克隆到本机进行修改。关键警告新手最常见的错误是克隆了被 Fork 的那个原仓库而不是自己 Fork 出来的仓库。请检查浏览器地址栏确认克隆的是你的用户名下的仓库。在 GitHub 上点击Code按钮再点击复制到剪贴板图标拿到仓库 URL。然后打开 Visual Studio Code按下F1打开命令面板输入框中已带有一个提示符也可以按CTRL-P后输入进入同一入口。输入git clone只输入git或clone也可以命令面板按关键字模糊搜索。在下拉结果中选择Git: Clone并回车。粘贴你刚才复制的仓库 URL 并回车VS Code 会弹出文件资源管理器让你选择仓库在本机的存放位置。命令面板中列出的其他历史命令是最近使用的缓存可以忽略。克隆过程中VS Code 右下角会出现一个状态弹窗完成后可通过弹窗中的按钮直接打开克隆下来的仓库文件夹。再次强调务必确认克隆的是你 Fork 出来的仓库而非原仓库否则后续推送和 PR 都无法按预期工作。第三步创建一个分支再次按F1打开命令面板输入branch从建议中选择Create Branch命令随后输入新分支的名称例如add-david-kroell建议使用add-你的用户名的命名约定回车后分支即创建完成并自动完成 checkout切换。关于 checkout这是 Git 的经典概念含义是切换到指定分支的工作区状态。在 VS Code 中创建分支后会自动 checkout因此你可以立刻在新分支上进行修改。从源码结构看README 的命令行版本使用的是git switch -c并在旧版 Git 下回退到git checkout -b见 README.md而 VS Code 图形界面把这一过程封装成了单一的 Create Branch 命令二者底层效果一致。第四步做出必要的修改在 VS Code 资源管理器中打开仓库根目录下的 Contributors.md 文件把名字加到贡献者列表中。几个实操要点该文件使用GFMGitHub Flavored Markdown语法即 GitHub 特有的 Markdown 方言对格式要求比较严格它可能很挑剔。推荐做法是复制一行已有贡献者的条目再改成你自己的名字确保语法正确文件条目格式为- [姓名](https://github.com/用户名)这种列表形式。保存文件CTRL-S以登记改动。README 的命令行版本还给出了一条额外建议不要加在文件开头或结尾放在中间任意位置即可见 README.md这样可以尽量避免与同一行附近的其他贡献者产生冲突。第五步Commit 并 Push 改动到 GitHubVS Code 左侧边栏有五个图标点击其中的源代码管理 / Source Control图标快捷键CTRL SHIFT G进入版本控制视图暂存Stage文件资源管理器会列出自上次 commit 以来所有改动的文件鼠标悬停文件并点击号将文件加入暂存区。提交Commit在暂存区顶部的输入框中填写提交信息例如Add your-name to Contributors list然后点击对勾checkmark按钮改动即被提交到本地仓库。推送Push改动目前只存在于本地副本还需推送到 GitHub。点击视图右上角的三个点菜单选择Publish Branch发布分支选项VS Code 会弹出对话框要求输入 GitHub 凭据认证通过后新分支连同其提交即被推送到你的 Fork 仓库。从 README 的命令行对照可以看出这一步等价于git add Contributors.md、git commit -m Add your-name to Contributors list与git push -u origin your-branch-name见 README.md此外 README 还提醒如果推送时遇到密码认证被移除的错误需要改用 Personal Access Token 或 SSH 密钥并用git remote set-url切换远程地址见 README.md。在 VS Code 的图形流程中只要使用浏览器登录或已配置 SSH这一环节通常是透明的。第六步提交你的改动以供审查至此改动已经完整存在但还只停留在你的仓库里。这一步是把改动提交给原仓库管理员审查、请求合并回到你的 GitHub Fork 仓库页面在新分支通知旁边会看到Compare Pull Request按钮点击它。在对比页面确认改动内容无误后点击Create pull request提交 PR。PR 提交后改动会进入原仓库维护者的审查队列合并完成后你会收到邮件通知贡献正式生效。原文档中也描述了同样的流程见 github-windows-vs-code-tutorial_pt_br.md。进阶保持你的 Fork 与上游同步完成首次贡献后后续参与项目时还会频繁遇到一个场景你的 Fork 落后于上游仓库。官方附加文档 keeping-your-fork-synced-with-this-repository.md 对此有详细说明。其核心是开源协作中典型的Triangle Workflows三角工作流涉及三个仓库上游公开仓库github.com/firstcontributions/first-contributions.git你在 GitHub 上的 Fork 仓库你本地机器的克隆仓库。同步顺序必须是先让本地与上游同步再把本地推送到你的 Fork。标准命令序列如下git status # 确认当前在 main 分支 git checkout main # 若不在 main 分支则先切换 git remote add upstream https://github.com/firstcontributions/first-contributions.git git fetch upstream # 拉取上游最新版本 git rebase upstream/main # 把上游合并进本地 main git push origin main # 推送本地 main 到你的 Forkorigin如果只想一条命令同时完成拉取 合并上游改动可以直接使用git pull upstream main建议在 GitHub 提示你的 Fork 落后若干提交a few commits behind时就执行一次上述同步。更多进阶材料与下一步完成本教程后additional-material.md 汇总了后续值得学习的进阶 Git 场景包括修改最近一次提交Amending a commit配置 Git 用户信息与选项把提交移动到其他分支从仓库删除文件删除仓库中的分支解决合并冲突撤销已推送的提交用交互式 rebase 压缩提交撤销本地提交创建 .gitignore 文件安全存储凭据总结恭喜你已经通过 Visual Studio Code 图形界面完整走通了fork → clone → edit → PR这一标准贡献工作流——这也是日后参与任何开源项目都会反复遇到的基本功。接下来你可以把这份经验迁移到其他项目先 Fork克隆到本地开分支改代码提交推送最后发起 PR 等待维护者审查合并。如果你更习惯命令行本仓库还提供了完整的 CLI 教程见 README.md如果想在其他工具GitHub Desktop、GitKraken、IntelliJ IDEA、Sourcetree 等中重复这套流程可以在 README.md 的 Tutorials Using Other Tools 表格中找到对应指南。赞分享文档教程开源治理【免费下载链接】first-contributions✨ Help beginners to contribute to open source projects项目地址https://gitcode.com/gh_mirrors/fi/first-contributions点击查看免费下载相关推荐用 Visual Studio Code 完成首次开源贡献first-contributions 图形化入门实战指南用 Visual Studio Code 完成首次开源贡献first contributions 图形化入门实战指南 导读 本文基于 first contri文档教程开源治理使用 Visual Studio Code 完成首次开源贡献first-contributions 全流程图文指南使用 Visual Studio Code 完成首次开源贡献first contributions 全流程图文指南 导读 本文基于开源仓库 first con文档教程开源治理使用 Visual Studio Code 完成第一次开源贡献first-contributions 图形化实战指南使用 Visual Studio Code 完成第一次开源贡献first contributions 图形化实战指南 本篇指南以开源教学仓库 first co文档教程开源治理创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表