美文网首页
git和vue/cli搭建项目的流程

git和vue/cli搭建项目的流程

作者: 酒暖花深Q | 来源:发表于2020-07-12 11:36 被阅读0次
通过 git --version 检查是否装了 Git

如果没装
就直接在git官网下载适合自己的版本

https://git-scm.com/

如果官网安装不成功
这里借用大佬的一片文章

https://www.aboutyun.com/thread-8521-1-1.html

打开cmd, 输入 node -v 检查node是否安装

官网安装 http://nodejs.cn/download/

安装完成以后 输入 npm -v 检查npm 是否检查成功 。npm是node的包管理工具

上面的都安装好了以后,打开 git官网创建项目
官网链接https://gitee.com/ 没有账号就注册一个

创建项目(注意我标红的地方)

M2.png M1.png

按照提示,点击创建即可,此时在码云就有了我们存储代码的仓库。接下来就希望本地代码和线上仓库代码相关联,这时候我们就需要创建公钥或者私钥,打通线上线下。在个人中心点击 点击 **设置 **。在左侧,我们点击SS公钥

m3.png
上面会显示怎么生成公钥 我们点击去

https://gitee.com/help/articles/4191#article-header0点击进去按照提示操作

这里也有一篇特别好的关于生成公钥的文章,我觉得是比官网还要详细
https://blog.csdn.net/zfs1994/article/details/52682129

也可以借鉴。window系统的童鞋是没办法在npm里面执行这些命令的,所以需要打开Git.Bush 来执行。
公钥创建好了以后 ,回到项目管理 的页面。点击克隆下载。好地址以后


m4.png

类型一定要选择SSH,复制地址。然后打开Git.Bush,将项目切换到自己想放的文件夹。输入命令行

git clone + 复制的地址点击回车。它的意思就是将线上仓库的代码克隆到本地

m5.png 这是文件夹里面就会多了一个文件夹travel(travel使我们在线上创建 的文件夹名) m6.png

由于我们需要创建一个vue的项目,所以我们再打开npm在我们travel文件夹里面输入vue 的命令行
https://cli.vuejs.org/ 这是vue的官网,可以查看命令

m7.png

创建完成vue项目以后需要把线下和项目和线上的保持一致。打开Git.Bush 输入

git status

点击回车 可以看到文件夹里面新增了很多项目,都是vue创建的。输入

git add . 

将本地仓库添加到git的一个缓冲区。再输入

git commit -m 'project initialized'

git commit的意思是 要把本地缓冲区的内容提交到本地,
-m 'project initialized的意思是这是一个初始化的操作。
' ----' ----是可以自己定义的内容

再运行

git push 

此时就成功的将线下仓库推到线上仓库

新建分支


m1.png

此时线上分支就做好了。打开本地终端

git pull

就可以看到远程的index-icons分支就被拉到本地


m2.png

下面我们就要切换到这个分支上进行开发

git checkout index-icons

在这个分支上我们就可以继续接下来的代码。

有了分支以后提交代码 前三步一样

git add . 
git commit -m '------'
git push 

然后我们需要到 master 分支上

git  checkout  master

master 上放的是整个工程最新的代码 。然后让master和线上的分支做一个合并

git  merge origin/index-icons

index-icons是线上分支的名称

1.png

这是合并成功的界面。最后

git push

查看分支

git branch

合并分支

git merge --- (---)是要合并的分支
1.png

相关文章

  • git和vue/cli搭建项目的流程

    如果没装就直接在git官网下载适合自己的版本 https://git-scm.com/; 如果官网安装不成功这里借...

  • 【Vue】教程:三、Vue Cli3项目结构优化

    前提 完成vue cli3项目的新建,可参考教程【Vue】windows下vue cli3安装及搭建项目详解 一、...

  • VUE学习之路一 项目搭建

    脚手架搭建vue项目框架 CLI3项目搭建查看 搭建方案 vue-cli 是一个官方发布 vue.js 项目脚手...

  • vue版本知识搜集

    2022-05-02一、vue-cli2 3 4差别很大 cli2、cli3可以搭建vue2项目;cli4可以搭建...

  • Vue-cli构建流程

    Vue-cli构建流程 学习vue时,总觉得vue-cli搭建很复杂,其实也不过如此,使用别人搭建好的包在打包时总...

  • vue全家桶

    vue-cli 是vue官方提供的快速搭建项目的工具,只是知道可以用vue-cli直接生成一个vue项目的架构,它...

  • 基于vue-cli@3.0搭建管理系统项目并进行配置优化

    项目说明 本示例根据vue-cli@2.0项目进一步优化,使用vue-cli@3.0搭建; 主要针对项目结构和权限...

  • vue 3.0 项目搭建

    这篇文章主要介绍下vue-cli3.0项目搭建,项目结构和配置等整理一下,分享给大家。 一、介绍 Vue CLI ...

  • vue3.0和2.0的区别

    vue3.0和2.0的区别及项目的搭建 - xy19950125的博客 - CSDN博客 vue-cli 3.0 ...

  • electron

    electron vue桌面应用入门实例 从零开始搭建,基于electron vue cli3 的桌面应用。git...

网友评论

      本文标题:git和vue/cli搭建项目的流程

      本文链接:https://www.haomeiwen.com/subject/iphvcktx.html