React学习之路 - 上传代码到GitCode

原创已于 2023-08-13 19:24:30 修改 · 283 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #前端框架 #react.js #gitcode

于 2023-08-13 16:51:02 首次发布

前端开发专栏收录该内容

38 篇文章

订阅专栏

本文介绍了如何在Git中进行全局设置，包括设置用户名、邮箱，以及在Mac终端上添加SSH密钥、初始化新仓库、添加提交并推送代码到远程origin的过程。

Git 全局设置

git config --global user.name "AnyaPapa"
git config --global user.email "****@***"

添加SSH密钥

Mac终端输入命令

cd existing_folder
git init
git remote add origin git@gitcode.net:Java_1710/test.git
git add .
git commit -m "Initial commit"
git push -u origin main

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Thomas Kant

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
打赏
打赏
打赏举报

举报

专栏目录

React Native热更新--搭建本地Code Push Server

龙飞雨的专栏

11-12

1812

()热更新原理 React Native会将所有需要加载的js文件都打包在一个bundle文件中，而app运行时会加载该文件。所以，热更新的一个可行思路是动态替换该bundle文件，然后重启app。如果修改原生代码则需要重新打包app。开发环境时使用调试工具可以 Reload JS其实就是替换bundle文件。微软的CodePush(https://microsoft.github.io/cod...

react-native 实现扫描二维码或拍照上传（react-native-camera）

zyn

05-07

1260

react-native 实现拍照上传及扫描二维码功能自从入了rn项目的坑，开始了踩坑历程，下面总结一下拍照上传遇见的坑：使用的插件是：react-native-camera 和 react-native-image-picker “react-native”: “0.59.9” “react-native-camera”: “git+https://git@github.com/react...

参与评论您还未登录，请先登录后发表或查看评论

github上适合练习的vue、react项目

前端-尔嵘

10-17

1826

1.初步练手但不是很全的vue2.0项目:(三天)https://github.com/WuNianLuoMeng/VUE 2.vue3.0钉钉项目：https://github.com/shiyongjason/dingding 3. 惠乐游PC首页vue-cli3.0：https://github.com/lucianxiang/hly_project3.0 4.vue3.0入门项目仿...

React 入门学习（八）-- GitHub 搜索案例

小丞同学

09-22

692

大家好，我是小丞同学，一名大二的前端爱好者这篇文章是学习 React 中 GitHub 搜索案例的学习笔记非常感谢你的阅读，不对的地方欢迎指正愿你忠于自己，热爱生活引言本文主要介绍 React 学习中 Github 搜索案例，这个案例主要涉及到了 Axios 发送请求，数据渲染以及一些中间交替效果的实现个人感觉在做完 TodoList 案例之后，这个案例会很轻松，只是多加了一个 Loading 效果的实现思路，以及一些小细节的完善，感觉练练手还

Github上8个很棒的React项目

u012384510的博客

06-21

7764

大家好，我是若川。持续组织了近一年的源码共读活动，感兴趣的可以点此加我微信ruochuan12参与，每周大家一起学习200行左右的源码，共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》包含20余篇源码文章。历史面试系列。另外：目前建有江西|湖南|湖北籍前端群，可加我微信进群。今天来分享 Github 上 8 个很棒的 React 项目，希望能通过学习这些项目...

react项目整理（react基础+react全家桶+ant-ui知识）基础篇(一)

bojikeqian的博客

10-09

276

基础知识点项目地址：https://github.com/yangxinjian/reactPractice.git 完整项目地址（主要是这个） https://github.com/yangxinjian/reactAntBike.git 准备阶段-基层环境安装node.js（官网下载即可） node -v (查看是否安装node完成) 安装yarn新一代的包管理工具facebook开发，你也可以选择cnpm yarn的速度会比npm快安装版本统一，更安全更简洁的输出更好的语义化 sudo c

React开发（144）:Git Commit 规范

歌谣的博客

09-10

437

#### ``` feature:开发新的功能 fix:修复bug refactor:代码重构 docs:文档修改 style:代码格式修改,注意不是css修改 perf:改善性能 build:变更项目构建或外部依赖（例如scopes:webpack、gulp、npm等） revert:代码回退比如：gitcommit-m'fix：修复某某bug' ``` ...

ruoyi-react-Typescript资源

02-08

- .gitignore：一个常用的Git配置文件，用于指定在版本控制中忽略哪些文件和目录，以避免将不必要的文件上传到代码仓库。 - LICENSE：包含有关软件许可信息的文件，说明了用户使用该资源的权利和限制。 - ry.sh：...

react-native-code-push

08-03

"React-Native-Code-Push" 是一个由微软开发的开源库，专为React Native应用程序设计，用于实现热更新功能。这个工具允许开发者在不发布新版本应用到应用商店的情况下，将代码更新推送到用户的设备上，极大地提高了...

React从基础入门到高级实战：React 生态与工具 - 构建与部署

zimin的专栏

05-30

1224

React构建与部署是Web开发的关键环节。本文全面介绍了构建优化技术，如Vite的分包和Tree Shaking；主流的部署平台选择(Vercel、Netlify、AWS)；以及如何使用GitHub Actions配置CI/CD流程。重点讲解了环境变量管理和安全性注意事项，并通过阿里云部署案例展示了实战应用过程。文章详细说明了从代码构建到线上部署的全流程，帮助开发者掌握React应用的优化和发布策略，确保项目的高效、安全部署。

react简书笔记一环境, git 和项目关联

dibengshao7358的博客

04-29

218

1..建立git项目 (码云,github都可以 ),具体步骤:https://www.cnblogs.com/andy-lehhaxm/p/10720717.html 　　1.1 git和项目关联: git remote add origin gti@gitee.com/CMCC_10086/reactJianShu.git ( git r...

前端之Git基础应用

ming的博客

05-09

581

作为最流行的开源版本控制系统，Git在Web前端开发中的应用范围非常广泛，它可以协助开发人员有效地跟踪代码更改、分支和合并、代码管理、持续集成/持续交付等方面的技术问题。因此，如果你是前端开发人员，并且想要更好地管理你的代码库和团队开发，那么Git的使用是非常值得学习的。

开源代码托管平台GitCode怎么用？看这篇就够了

最新发布

09-21

<think> 我们正在讨论Git代码提交问题，用户的最新问题是询问前端代码能否上传到Git。根据之前的对话历史和提供的引用，这是一个简单明确的问题，但需要结合Git的通用性和前端项目特点来回答。首先明确回答用户的核心问题：是的，前端代码完全可以上传到Git。Git作为版本控制系统，对代码类型没有限制，无论是前端、后端还是文档都可以管理。这一点在提供的引用中都有体现，特别是引用[4]专门讨论了前端代码上传到GitHub的案例。接下来需要解释为什么用户会产生这个疑问。可能的原因包括： 1. 前端项目通常包含node_modules等依赖目录，体积庞大 2. 前端构建会产生dist等输出目录 3. 某些前端框架有特殊配置文件因此要重点说明解决方案： - 必须配置.gitignore文件（如引用[3]提到的），忽略node_modules、.env等 - 上传源码而非构建产物（引用[5]的git add .命令只添加必要文件） - 框架特殊文件（如Vue的vue.config.js）需要保留最后用步骤化说明让用户立即可操作： 1. 创建仓库时选择前端项目模板.gitignore（引用[1]的初始化步骤） 2. 执行标准Git操作流：add -> commit -> push（引用[2][5]的基础命令） 3. 处理常见问题：大文件用Git LFS（引用[1]的问题解决方法）考虑到用户可能是初学者，避免深入Git原理，而是聚焦实操。同时关联之前的IDEA教程，说明在IDE中操作更简单（如引用[2]的提交跳过检查选项）。相关问题设计要引导用户了解进阶内容： - 前端项目的.gitignore最佳实践 - 如何处理前端静态资源版本管理 - 持续集成部署前端项目的Git配置 </think> 是的，前端代码可以完全兼容 Git 版本控制系统。以下是关键说明和操作建议： --- ### **一、前端代码上传 Git 的可行性** 1. **语言无关性** Git 是**语言无关的版本控制工具**，适用于任何文本文件（包括 HTML/CSS/JS/TS/Vue/React 等前端代码）[^1][^4]。 2. **实践验证** 引用[4]和[5]明确展示了前端项目上传到 GitHub/Gitee 的成功案例，包含完整的前端框架项目结构。 --- ### **二、前端项目上传 Git 的特殊注意事项** #### **1. 必须配置 `.gitignore` 文件** ```gitignore # 前端典型忽略规则 node_modules/ # 依赖目录（核心！） dist/ # 构建输出 .cache/ # 构建缓存 .env # 环境变量文件 .DS_Store # Mac系统文件 *.log # 日志文件 ``` > 📌 **重要性**：避免将 `node_modules` 等大型目录提交到仓库（单项目可能超过 200MB）[^5]。 #### **2. 提交前代码检查** - 使用 ESLint/Prettier 等工具（引用[2]的 `--no-verify` 可跳过检查） - 在 IDEA 中：`Commit` → 勾选 `Analyze code` + `Check TODO`[^1] #### **3. 敏感文件处理** - 绝对禁止提交包含密钥的文件（如 `.env.production`） - 使用 `git rm --cached <file>` 移除已提交的敏感文件[^5] --- ### **三、前端代码上传 Git 标准流程** 1. **初始化仓库**（首次上传） ```bash git init git remote add origin https://github.com/yourname/project.git # 引用[4] ``` 2. **添加文件** ```bash git add . # 添加所有文件（引用[3][5]） # 或选择添加 git add src/ package.json ``` 3. **提交到本地仓库** ```bash git commit -m "feat: 完成首页响应式布局" # 引用[2][5] ``` 4. **推送到远程** ```bash git push -u origin main # 首次推送需指定分支 git push # 后续推送简化 ``` > 💡 **IDEA 可视化操作**：右键项目 → `Git` → `Commit` → 填写信息 → `Push` --- ### **四、不同前端框架的适配建议** | **框架类型** | **需重点关注的文件** | **处理建议** | |--------------|------------------------------|----------------------------------| | Vue/React | `package.json`, `vite.config.js` | 必须提交 | | 静态网站 | `index.html`, `assets/` | 忽略构建产物目录 | | Node 项目 | `server.js`, `.env.example` | 用 `.env.example` 替代真实环境变量 | --- ### **五、上传失败常见解决方案** 1. **大文件报错** ```bash # 安装 Git LFS（大文件支持） git lfs install git lfs track "*.psd" # 跟踪设计稿等二进制文件 git add .gitattributes ``` 2. **分支冲突** - 执行 `git pull --rebase` 合并远程修改 - 在 IDEA 中使用可视化冲突解决工具（见下图） ![IDEA冲突解决界面](https://resources.jetbrains.com/help/img/idea/2023.3/git_conflicts_dialog.png) --- ### **六、前端项目 Git 最佳实践** 1. **分支策略** ```mermaid gitGraph commit branch feature/login checkout feature/login commit checkout main merge feature/login ``` 2. **提交规范** ```markdown feat: 添加用户登录模块 # 新功能 fix: 修复按钮点击事件 # Bug修复 docs: 更新README文档 # 文档变更 ``` --- **