本地创建新项目如何上传到gitlab仓库中

电玩女神 2022-03-15 12:06 527阅读 0赞

# 本地项目上传到gitlab仓库 #

现在前端各种框架比如vue react…等都会比较友好的推出自己的脚手架，  
这样在项目刚开始的时候能够快速的搭建一个项目结构，然后进行业务开发。  
这里就简单介绍一下本地用脚手架创建完项目之后如何上传到远程gitlab仓库上

## 本地新建项目 ##

这一步不同的前端框架都会有自己不同的命令.  
比如react有自己的create-react-app projectName  
vue有自己的 vue init webpack projectName  
脚手架命令跑完之后就会有一个项目的基本骨架了。

## gitlab上新建一个项目 ##

1:gitlab选择一个group然后新建project  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70]2:设置新建project的一些初始信息  
比如项目的名称，项目访问的url路径和可见性设置等基础信息,设置好之后可点击create project按钮，稍等片刻，这个项目就会被新建在这个group之中  
如下所示:  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 1]点击之后稍等片刻就会出现新建好的project,如下图所示:  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 2]

## 将本地和远程仓库关联并push本地项目 ##

我这里用的是Intellij IDEA编辑器来演示，操作如下：  
1:![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 3]2:会自动访问到当前项目的路径，直接点击open即可  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 4]3：这个时候左侧的文件会变红，红色在idea的git版本表示未add的文件,同时在系统资源管理中打开项目的磁盘文件目录，会发现一个.git的隐藏文件，这个文件就git的配置和仓库文件。如下图所示:  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 5]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 6]  
4:push到远端仓库  
先add然后commit 提交到本地仓库  
![在这里插入图片描述][20190302154743504.png]  
在IDEA中shift + command + k会弹出如下框：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 7]弹出如下所示框![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 8]  
在URL输入框中设置刚刚在git仓库中新进空project的地址即可，  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 9]

输入刚刚粘贴的url然后点击ok按钮  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 10]  
到了这一步已近将本地git和远程gitlab仓库地址做了映射，接下来要做的是将本地的某一个分支追踪到远端仓库的某一个分支，这里以本地master追踪到远程master为例，其余分支也一样，其实master就是一个普通的分支。  
可以使用

*  git pull 拉取远程分支到本地
 *  git branch -vv 查看本地分支和远程分支的映射情况
 *  git branch -u origin/master (此时处于master分支上)，将本地master和远端master建立映射
 *  如果报错 'fatal: refusing to merge unrelated histories’的信息的话，可以使用

git pull origin master --allow-unrelated-histories

来解决，具体原因可以查看这篇文章:  
[https://blog.csdn.net/weixin\_38080573/article/details/88092813][https_blog.csdn.net_weixin_38080573_article_details_88092813]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 11]  
可以在仓库中看到已近有了本地的项目  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 12]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70]: /images/20220315/fbcedc32068e4358bd041e2b83756032.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 1]: /images/20220315/2da6bd4879a341cab3429f8e5bffb1c7.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 2]: /images/20220315/01fe338dc1eb4a73b1e29fa9f6261c79.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 3]: /images/20220315/faabf95e74f44f9f8b87197affd3f87f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 4]: /images/20220315/20263d47824f4f72802f6338f3922bfd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 5]: /images/20220315/784701b136254faa8663926abedd93a8.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 6]: /images/20220315/28224a3058d14ebbb57256e4629d377e.png
[20190302154743504.png]: /images/20220315/f8dc6889d36244cc8da8316d93c27bc6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 7]: https://img-blog.csdnimg.cn/20190302155130802.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 8]: /images/20220315/3a8358f95e35468cbf645dd199a8e350.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 9]: /images/20220315/61fef32d021841d1830cba67b1733982.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 10]: /images/20220315/b2bbd7221f394b7aaaf2a581d4048c84.png
[https_blog.csdn.net_weixin_38080573_article_details_88092813]: https://blog.csdn.net/weixin_38080573/article/details/88092813
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 11]: /images/20220315/6212d7df30e44e4aae3a5abf1d60dc24.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl8zODA4MDU3Mw_size_16_color_FFFFFF_t_70 12]: /images/20220315/019db2503f0b459db2b84991685ad6ac.png