在本地使用 Live Server 开发并通过Git 进行版本控制初始化本地 Git 仓库 init在 VS Code 中打开你的网站项目根目录打开快捷键Ctrl ~或Cmd ~调出内置终端。输入以下命令初始化仓库git init设置身份仅需做一次 让 GitHub 知道代码是谁写的。git config --global user.name 你的GitHub用户名 git config --global user.email 你的GitHub邮箱EX1网站需要插入媒体文件: 配置.gitignore文件非常重要为了防止把无用的大文件如视频、临时文件、依赖包提交到 Git 仓库必须在项目根目录下新建一个名为.gitignore的文件填入以下内容# 忽略所有媒体大文件本地测试用的视频/大图 *.mp4 *.mkv *.avi *.mov # 忽略操作系统自动生成的文件 .DS_Store Thumbs.db # 忽略编辑器配置 .vscode/ # 如果后续使用了 Node.js忽略依赖包 node_modules/.gitignore只能忽略“未被追踪Untracked”的文件。如果某个.mp4文件之前已经被git add并提交过了后续再把*.mp4写入.gitignore是不会生效的需要先用git rm --cached file从暂存区移除。提示开发用的测试视频不要传进 Git 仓库生产环境建议把视频上传到对象存储如阿里云 OSS或使用专门的存储目录。完成你的第一次“提交” (Commit)现在我们要把这个README.md正式记录进 Git 的历史中。git status在终端输入 。你会看到README.md是红色的表示它是“未追踪”的新文件。这里的图例是html网站不是README.md除此之外git log --oneline用简洁单行形式查看过往提交历史确认自己的 commit 有没有成功。git add README.mdgit commit -m Initial commit: add README and project description # git调用 Git 工具。 # commit核心动词意思是“提交”。它告诉 Git“把我刚才用 git add 选中的那些改动正式打包存进我的仓库历史里。” # -m它是 message消息的缩写。这个“参数”告诉 Git后面引号里的内容就是这次提交的说明。 # Initial commit: ...这是你写的备注文字。 # Initial commit通常作为项目的第一次提交记录意为“初始化提交”。 # add README...解释了你这次具体干了什么。此时你已经成功保存了一个版本撤销错误的git init 直接在 Windows 文件资源管理器里 直接删除那个.git文件夹但add和commit操作完成之后去github新建仓库打开 GitHub 并登录。点击右上角的****-**New repository**。输入仓库名称如my-first-web不要勾选“Add a README file”保持空仓库点击**Create repository**。关联远程仓库并推送# 1. 将主分支重命名为 mainGit 当前推荐标准 git branch -M main # 2. 将本地仓库关联到 GitHub 上的指定仓库请将 URL 替换为你自己的仓库地址 git remote add origin https://github.com/你的用户名/你的仓库名.git # 3. 将本地代码推送到 GitHub git push -u origin main常见报错hint: have locally. This is usually caused by another repository pushing to hint: the same ref. If you want to integrate the remote changes, use hint: git pull before pushing again. hint: See the Note about fast-forwards in git push --help for details.解决办法1.合并远程内容后推送# 1. 拉取远程内容并允许合并无关的历史记录 git pull origin main --rebase # 2. 再次尝试推送 git push -u origin main如果你使用的主分支名称是 master请将上述命令中的 main 替换为 master2.强制覆盖远程仅限新建/测试/个人项目git push -u origin main --force推送至Githubpushgit push如果是第一次推送可能需要输入git push -u origin main注如果你默认的分支名是master则把main换成master总结操作流程以后你修改代码后的标准动作应该是修改代码并保存。**git add .**或在 UI 点 “” 号 ——选好要拍的照片。**git commit -m 备注**或在 UI 填消息点“提交” ——按下快门存入本地相册。**git push**或在 UI 点“同步” ——上传到云端相册GitHub。EX2推荐首选“GitHub 创建 - 本地git clone”先在 GitHub 上创建项目在 GitHub 首页点New按钮。填写仓库名。勾选“Add a README file”这样 GitHub 会自动帮你创建好main分支和 README 文件。克隆到本地在 GitHub 项目页面点绿色的Code按钮复制里面的 HTTPS 链接。在 VS Code 终端里进入D:\VScodeFile输入git clone 你刚才复制的链接这样做的好处是Git 会自动帮你把本地和远程的“管道”连接好你不需要再研究_git push -u origin master_了。二、 日常开发工作流循环使用你在本地用 Live Server 边改代码边看效果时Git 的日常使用分为三步改动 - 暂存 - 提交。方法 A使用 VS Code 图形化界面推荐最直观查看改动点击 VS Code 左侧边栏的“源代码管理”按钮图标是一个分支快捷键CtrlShiftG。你会看到所有被修改或新增的文件列表。暂存更改Stage点击“更改”列表右侧的****加号或者单独点击某个文件旁的把文件加入暂存区。提交Commit在顶部的输入框写一句简短的修改说明例如添加首页导航栏或修复响应式布局问题然后点击“提交”Commit按钮。方法 B使用终端命令行如果你更喜欢命令行操作只需记住三行命令Bash# 1. 查看当前修改状态 git status # 2. 将所有修改过的文件添加到暂存区 git add . # 3. 提交修改并附上本次修改的日志 git commit -m 完成首页UI开发及交互优化三、 联动远程仓库与部署可选扩展当你完成阶段性开发想要把代码发布到线上服务器时有两种规范的方式方案 1推送到远程代码托管平台如 GitHub / Gitee在 GitHub 或 Gitee 上新建一个私有/公开仓库。按照平台提示把本地仓库与远程关联Bashgit remote add origin 你的远程仓库地址.git git branch -M main git push -u origin main以后每次本地提交完只需运行git push即可把代码同步到云端。方案 2将代码同步/部署到你的 Ubuntu 服务器当本地开发测试完全没问题后只需在服务器端把代码拉取pull下来即可完成上线首次部署SSH 连接服务器运行git clone 仓库地址。日常更新在服务器项目目录下运行git pull即可几秒钟就能完成更新彻底告别在服务器上直接写代码导致磁盘 IO 飙升崩溃的问题。