ARTICLE DETAIL

资讯详情

深耕编程入门与网站建设的一线实战洞察。

GitHub上传文件夹全指南:网页拖拽与Git命令双方案详解

GitHub上传文件夹全指南:网页拖拽与Git命令双方案详解 前阵子有个做数据分析的朋友问我他想把整个项目文件夹传到GitHub上里面有几十个脚本、好几份数据表、还有一堆说明文档。他在网页上拖拽了几次都失败要么断掉要么文件不齐最后跑来问我有没有一个“不会翻车”的办法。这个问题我确实被问过太多次了因为很多人一开始接触GitHub都是从“上传一个文件夹”这个需求开始的。上传文件夹到GitHub本质上就两条路一是直接用网页端拖拽上传适合临时传几个小文件二是用Git命令行推送这才是正规军玩法文件夹层级再深、文件再多也不怕。这篇图文教程我会把两条路的完整操作都拆开讲从准备环境到最后一条命令都配了界面说明新手照着做就能成功用Git有一阵子的朋友也可以刷刷命令参数、看看常见报错怎么解决。1. 上传前需要准备什么先把前置条件理清楚免得做到一半发现缺这缺那。整个过程需要三样东西一个GitHub账号、一个Git客户端、一个能确认你身份的SSH Key。1.1 注册GitHub账号并明确用途GitHub账号是操作的大前提仓库、代码、版本记录都在账号下面管理。注册时打开github.com填写用户名、邮箱、密码即可。用户名要慎重因为它会出现在你的仓库地址里比如gitgithub.com:用户名/仓库名.git以后发给同事、写进简历都会用到。邮箱建议用常用邮箱因为Git推送记录里会显示邮箱而且仓库的贡献图也需要邮箱关联。注册完成后顺手在右上角头像菜单里进入 Settings把 Personal profile 里的信息补一补。这个不强制但如果你想把GitHub当个人技术名片用一个写清楚方向的头像和简介会让别人一眼看懂你是做什么的。上传第一个文件夹之前不用急着研究那些复杂功能新手期的核心任务就是把代码放上去、能拉下来。1.2 安装Git客户端并检查版本Git是上传文件夹的核心工具它的作用是把你本地的文件夹变成一个“仓库”然后追踪每一次文件改动。不同系统安装方式不一样Windows去 git-scm.com 下载安装包一直Next即可。最关键的一步是在安装过程中勾选Git Bash Here这个右键菜单选项后文所有命令我建议都在 Git Bash 里执行而不是CMD因为Git Bash的命令风格和Linux一致很多教程默认以它为准你跟着做不容易踩坑。macOS最简单是装Homebrew后执行brew install git或者直接下载官方安装包。Linux执行sudo apt install gitUbuntu/Debian或sudo yum install gitCentOS/RHEL。安装完验证一下在终端里输入git --version能看到类似git version 2.40.0的输出就说明装好了。如果提示找不到命令多半是安装没成功或者环境变量没配好Windows查一下系统环境变量的Path里有没有Git路径macOS/Linux检查一下包管理器是否真的装完了。1.3 配置用户信息与SSH Key装好Git之后还有两件事要做。第一件是告诉Git你的名字和邮箱这样每次提交日志里就能显示作者信息git config --global user.name 你的昵称 git config --global user.email 注册GitHub时用的邮箱第二件是生成并配置SSH Key。它的作用就是让你以后推送代码时不用每次都输密码GitHub通过公钥来识别你的电脑。生成命令ssh-keygen -t ed25519 -C 注册GitHub时用的邮箱一路回车即可默认会在用户目录的.ssh文件夹下生成一对密钥。然后用文本工具打开id_ed25519.pub把里面内容全部复制回到GitHub的 Settings → SSH and GPG keys → New SSH key粘贴保存。验证是否配置成功ssh -T gitgithub.com如果输出Hi 用户名! Youve successfully authenticated就说明链路通了。这里多说一句对新手来说用SSH协议比HTTPS省心因为HTTPS推送有时会遇到Token过期或者密码验证问题SSH配置一次能管很久。2. 网页端直接上传文件夹如果你只是想把一个不大不小的文件夹传上去最直接的办法其实是网页端的拖拽上传。不用装任何工具、不用敲命令打开浏览器就能完成适合临时传几个文件、或者给仓库补充一些文档素材。2.1 新建一个空的GitHub仓库先登录GitHub点击右上角的号选New repository。在创建页面填仓库名比如my-project可见性选Private私有或Public公开。这里有一个新手容易忽略的关键点创建时不要勾选Add a README file和.gitignore也先别选License。原因后面讲命令行时细说这里先记住“创建纯空仓库”这个原则后续操作会顺畅很多。创建完会进入一个空仓库页面页面中间会显示关联远程仓库的几条命令提示先不用管它继续往下看网页上传的操作。2.2 网页端拖拽上传的操作步骤进入空仓库页面后找到Add file下拉菜单点击Upload files这时浏览器会打开一个拖拽区域。整个文件夹拖进去或者点choose your files选择多个文件都可以。上传过程中浏览器会列出所有待上传文件如果你拖入的是文件夹路径结构会保留。确认文件列表没有问题后在页面底部填一个提交说明比如init: 添加项目文件夹然后点Commit changes。上传完成后仓库前端页面就能看到整个文件夹的目录结构了点进去也能逐个查看文件内容。这一步界面比较直观我要提醒的是上传过程中不要关闭标签页也不要点别的链接因为文件越多、体积越大的上传越依赖一次完整的会话中断了需要重新来过。2.3 网页端上传的局限性与适用场景网页端上传虽方便但限制也很明显单个文件不能超过100MB超过会上传失败。一次上传的文件数量不宜过多几十个还好几百个文件时浏览器会非常卡甚至直接崩溃。网页端无法上传空文件夹因为Git本身就不跟踪空目录你在本地建了一个空文件夹想占位网页端拖进去根本不会显示。网页端没有版本管理习惯每个文件的上传其实是一次提交但改起来很麻烦第二次想更新某个文件还得重新拖一遍。所以我的判断是网页端适合做“第一次快速填充”和“偶尔改文档”如果这个文件夹是你会持续更新的项目目录那无论如何都应该转向命令行方式。这也是下一篇为什么要花大篇幅把Git命令讲透的原因。3. 命令行方式Git Bash上传文件夹的完整流程命令行方式才是真正解决“上传文件夹”这个需求的可靠方案。我习惯把所有步骤拆成两个场景本地还没有任何仓库的从零推送以及本地仓库已经存在后的日常更新。3.1 场景一本地文件夹从零推送到GitHub假设你本地的项目文件夹叫my-project里面已经有若干子文件夹和文件现在想把它完整推送到刚刚在GitHub上创建的空仓库。第一步在文件夹内部空白处点击鼠标右键选择Git Bash Here进入对应的命令行目录。接着初始化仓库git init终端会显示提示告诉你在当前目录初始化了一个空的Git仓库。这一步会在文件夹里生成一个隐藏的.git目录它用于记录所有版本历史不要随意删除。第二步把文件夹里的所有文件加入“暂存区”git add .命令最后的点号表示当前目录及子目录下的所有文件。如果你想选择性添加也可以把点号替换成具体的文件夹名或文件名比如git add src docs这样就不会把不需要的文件纳入版本管理。第三步提交一次快照git commit -m 第一次提交上传项目文件夹执行前可以先运行git status看看暂存区有哪些文件确认没有遗漏。提交完成后终端会显示文件变更数量和摘要。第四步关联远程仓库。去GitHub仓库页面复制远程仓库地址推荐使用SSH地址git remote add origin gitgithub.com:用户名/仓库名.git第五步把默认分支改名为main并推送git branch -M main git push -u origin main推送过程中如果一切正常终端会显示Enumerating objects、Writing objects以及最后* [new branch] main - main的提示。此时刷新GitHub仓库页面就能看到本地文件夹的内容已经完整出现在网页上了。-u参数的作用是把本地分支和远程分支关联起来以后直接敲git push就能推送不用再写完整分支名。3.2 场景二已有仓库的日常更新如果你的本地仓库已经建立好了后续往仓库里新增文件夹就是高频操作了。流程更简单先把你想要新增的文件夹整个复制到本地项目目录中然后依次执行git add 新文件夹名 git commit -m 添加新功能模块文件夹 git push这里我建议git add时指定具体文件夹名而不是无脑git add .。原因很简单限定范围可以降低把无关改动或临时文件误传上去的风险。如果今天你只改了A模块的代码和一个新增资源目录那就只add这两个范围commit信息也能写得足够清晰将来查历史的时候一眼就看明白。3.3 远程仓库已存在文件时的合并推送还有一种情况很常见你已经在GitHub网页上创建了仓库并勾选了README但本地也用git init初始化并提交了文件。此时直接git push大概率会报错! [rejected] main - main (fetch first)原因是两个仓库的提交历史互不相干。解决办法是把远程内容先拉下来合并git pull origin main --allow-unrelated-histories git push origin main--allow-unrelated-histories这个参数允许两个没有共同祖先的提交历史合并这是处理“网页建仓库 本地建仓库”冲突的典型命令。执行完git pull后本地会多出远程仓库里已有的README文件如果没有冲突直接push就能成功了。这也是为什么我在2.1建议创建仓库时不要勾选任何初始化文件——省去这一步从零推送就会少很多麻烦。4. Git常用命令与核心概念拆解很多教程上来就让你背命令但你不知道这些命令背后的逻辑换个场景就不会用了。这一节我用简单类比把Git的几个核心概念讲明白再给一份常用命令速查表。4.1 工作区、暂存区、历史提交的关系可以把Git仓库理解成一个“带候车厅的火车站”工作区就是你的项目文件夹你在这里正常写代码、放文件git add的作用是把文件送进候车厅也就是暂存区git commit则相当于正式检票上车生成一个不可变的“快照”记入历史git push是把这趟车开到远程仓库那个“远方站台”。新手最容易混乱的是add和commit的区别。你不理解为什么要分两步就会少敲或不敲某条命令。实际协作场景中分批add的意义在于逻辑分组比如你改了一个bug又新加了一个功能完全可以在一次提交里选择性地add不同文件再用一条明确的commit信息描述这次改动的主题。养成这个习惯后回滚版本时粒度会非常清晰。4.2 常用命令速查表命令作用关键参数git init在本地初始化仓库无git status查看当前工作区与暂存区状态无git add .或git add 文件夹名添加所有或指定文件到暂存区.表示全部git commit -m 说明提交暂存区内容到本地历史-m后跟提交信息git push origin main推送本地提交到远程仓库分支-u表示建立关联git pull origin main拉取远程仓库最新内容并合并无git log --oneline查看提交历史简略列表无git remote -v查看远程仓库地址无记得每次推送前养成习惯先跑一下git status看看当前工作区是不是干净的有没有临时文件混进去。我见过太多次把.env或者其他系统临时文件推上仓库的尴尬了源头就在这个环节。4.3 分支理解与 .gitignore 规则分支这个概念新人容易云里雾里。简单理解main是主线你可以从主线上分出独立的“工位”来做新功能做完再合并回主线。单人使用GitHub维护笔记或项目时常驻main分支完全够用但必须知道分支的存在因为协作场景下没人会直接往main上乱推。另外项目里往往有些文件夹是不应该上传的比如依赖目录、缓存文件、日志、本地配置文件等。这时就要在项目根目录新建一个.gitignore文件里面写上忽略规则node_modules/ .DS_Store *.log __pycache__/ .env规则很简单目录名/代表忽略整个目录*.log代表忽略所有log后缀文件。这个文件必须在首次git add之前就放好否则已经被追踪的历史不会自动删除。如果发现重要文件已经误传可以先把它从暂存区移除但不删除本地文件git rm -r --cached 误传目录然后重新提交再推送一次远程仓库里就不会有这些文件了。5. 常见问题与排查技巧实录命令敲得再熟练也总有报错的时候。我把实践中遇到频率最高的六类问题列在这里并给出对应的排查思路和解决方案你可以直接当成排查手册用。5.1 push被拒绝远程包含本地没有的提交错误信息通常是这样! [rejected] main - main (fetch first) error: failed to push some refs to ...原因是远程仓库有本地没有的提交历史最常见的就是你在网页端新建仓库时自动生成了README之类的文件。两条路处理如果远程的提交文件不想要可以直接在网页端删除如果远程的文件有保留价值执行git pull origin main --allow-unrelated-histories git push origin main很多刚学会Git的人一看到(fetch first)就慌其实只要知道这不是代码冲突只是历史合并问题按上面步骤走就行了。5.2 大文件上传失败或推送卡住GitHub对普通仓库单文件有100MB的硬限制超过就会报错remote: error: File xxx is 123.45 MB; this exceeds GitHubs file limit如果这个文件不该进仓库就在本地删除并更新.gitignore如果确实需要存放大文件就要用Git LFSLarge File Storage方案具体做法是安装Git LFS扩展后执行git lfs track *.zip把大文件交给LFS托管。还有一个容易被忽略的场景推送时终端长时间卡在Writing objects可能是网络问题也可能是单个仓库文件实在太多。这种时候耐心等一会儿不要反复CtrlC中断后重新推送往往要重传反而更慢。5.3 误提交了敏感信息这是最需要小心的问题比代码报错严重得多。如果.env、密钥文件或者带密码的配置文件不小心推到了仓库立刻做这几件事git rm --cached .env echo .env .gitignore git add .gitignore git commit -m 移除敏感文件 git push同时记住仅仅删除历史是不够的已经暴露的密钥要当作泄露来处理马上到对应平台重新生成密钥。GitHub有自动扫描密钥的机制某些密钥明文推上去后平台会直接提醒你更换所以这类错误越早处理越好。5.4 中文文件名或路径乱码有些人的项目文件夹里带了中文路径Git在默认配置下会把非ASCII字符转义显示成类似\346\265\213的编码看起来像乱码。这不是文件损坏只是显示问题设置一条配置即可git config --global core.quotepath false设置后git status和仓库页面里的中文文件名就能正常显示了。顺带一提commit信息里写中文完全没有问题但提交信息建议保持简洁体别写得像聊天记录否则未来翻历史时会很难受。5.5 推送成功但网页看不到文件这种情况多半是分支名对不上。你执行git push origin main推送到main分支但GitHub仓库默认展示的分支也可能是master或者别的分支。检查方法看仓库页面的分支下拉菜单当前切换的是哪个分支切换到main即可。还有一种是推送本身没成功只是终端没注意看报错这时候跑一下git status如果提示领先远程几个提交说明还没推送完成。5.6 误传大量临时文件、依赖目录把node_modules或__pycache__这类巨型临时目录推上去是新手非常容易犯的错误。处理方法是先加.gitignore然后移除已追踪但不需要的目录缓存再次提交推送。如果仓库远程历史里已经存在了这些大目录简单的index清除是不够的因为历史提交仍然占用空间。最省心的做法是趁项目刚刚启动、远程仓库内容不多时直接把本地.git目录删除重新git init并推送到一个新仓库把历史彻底断掉。6. 日常维护与协作效率心得文件夹成功上到GitHub只是万里长征第一步真正让Git发挥威力的是日常维护习惯。这里分享几个我从实战中总结出来的做法不算多高深但确实能帮你少踩很多坑。6.1 写好提交信息比写代码更体现专业度我见过太多update、aaa、123这种没有任何信息量的提交记录。写得好的提交信息应该能完整地回答两个问题这次改了什么为什么要这么改。推荐一个简单的格式模版类型(范围): 简述 细节说明可选比如fix(登录模块): 修复密码输入错误时无提示的问题或者feat(数据导出): 新增CSV导出功能。这种规范会让三个月的你回头翻历史时一秒定位问题也让团队其他成员不需要逐个点开文件对比才能看懂你的改动。6.2 养成先拉取再推送的协作习惯只要仓库是多人共用的推送前先跑一句git pull origin main永远是安全的。很多人习惯先改代码、再add、再commit、最后pushpush失败才想起来远程已有更新这时候可能已经产生冲突了。如果你养成每天开始工作前先pull的习惯绝大多数冲突在源头就能避免。如果真的遇到了代码冲突记住一个原则不要慌、不要乱删代码。Git会在冲突文件里用特殊标记标出两边内容看清楚哪段是你的、哪段是团队的再决定怎么合并。解决后执行git add 文件和git commit完成合并提交即可。6.3 用GitHub Desktop或IDE自带工具降低入门成本不是所有人都有精力把Git命令背得滚瓜烂熟。如果你觉得命令行比较吃力可以先下载GitHub官方出品的 GitHub Desktop 图形客户端它把add、commit、push、pull这些高频操作做成了按钮和可视化面板上传文件夹时直接Add local repository选中本地目录再点Publish repository就能完成推送。相比纯命令行图形式操作对新手更友好而且每一步都有明确的界面状态提示。等你通过图形界面理解了Git的基本工作流再回头看命令行的那些操作会发现一切都顺理成章。工具只是载体核心是理解仓库、暂存区、提交、分支这几个概念之间的关系。6.4 项目目录结构建议最后聊一下仓库本身的组织。很多人把GitHub当网盘用什么文件都往里堆最终仓库结构混乱时间一长没人愿意维护。一个稍微像样的项目文件夹建议至少分成几类源码目录、文档目录、配置文件、数据文件目录。然后在根目录放一个README.md用几句话说明项目是干什么的、怎么跑起来、目录结构是怎样的。这样不仅别人看着舒服三个月后的你自己也会感谢当初花这十分钟。我个人的经验是GitHub仓库就是你的作品集怎么组织文件体现的是你的工程习惯和思考方式。哪怕只是上传一个学习笔记的文件夹花点时间给README写清楚背景和目录结构长期积累下来价值会远超你的想象。上传文件夹这件事本身很简单但背后涉及的Git工作流、版本管理意识、仓库规范才是真正值得花心思掌握的东西。把这一套流程跑通以后后续不管你是往仓库里扔代码、写博客、还是存文档都会非常顺手。
返回列表