下载和运行GitHub上的代码教程总结

我会带着你远行 2022-05-22 05:41 199阅读 0赞

> 之前做学校的毕业设计，想从Github上下载一个Vue项目作为模板，由于之前没有从gitHbu上克隆项目的经验，结果花了大半天在从github上面把项目克隆下载。现在有时间记录以下，方便其他小伙伴一起学习。

如何从GitHub上下载自己需要的项目：

1.首先，你要有一个自己的GitHub（https://github.com/）的账号。关于如何注册GitHub的账号以及如何获取你的SSH密钥这个问题，请大家参考https://blog.csdn.net/p10010/article/details/51336332。当然，最好是自己去网上搜索一下。

2.你需要安装Git。关于这个问题，我想，廖老师的https://www.liaoxuefeng.com/里面的Git教程，讲的就再详细不过了，这里我就不再赘述了。

3.下载你所需要的项目：

3.1.登录你的GitHub账号：

![20180330144818923][]

3.2.通过关键字，搜索你需要的项目

![20180330145000307][]

3.3.下载项目：

![20180330145311236][]

这里可以看到clone or download，如果你安装了GitHub的客户端的话，那么你直接点左下角的Open in Desktop,就可以在你本地的客户端直接打开。如果你想直接下载的话，那么就点击右下角的Download Zip，可以直接下载项目的压缩包到你的电脑上。这两种方式基本上属于一看就能明白的，我这里也就提一嘴。

值得注意的是，如果你这两种方式都不想用，而是想要通过git clone ...的方式下载项目的话。那么请注意看接下来的操作。

3.3.1.通过HTTP的方式克隆项目：

如果你的账号没有添加SSH密钥，那么你可以用HTTP的方式克隆项目。

3.3.1.1.点击红色框圈住的位置，复制项目地址

![20180330150516657][]

3.3.1.2.打开你想要存储的该项目的位置（如E:\\Project），鼠标右键，点击Git Bash Hear，弹出Git命令窗口，输入

git clone 你复制的项目地址，如下所示，然后回车

![20180330151428608][]

当弹出如下所示的时候，表示你已经下载成功了。

![20180330151507848][]

这个时候，你再进入你保存文件的位置，就会发现已经有一个文件夹了。

3.3.2.通过SSH的方式下载项目。

如果你是登录的状态，并且已经添加过SSH密钥，那么你在点击Clone orDownload的时候，就会出现：

![20180330152158826][]

那么就如同上面通过HTTP的方式下载项目一样，复制ssh的克隆地址。然后在Git Bash的命令窗口输入git clone 你复制的地址，回车，然后直到出现下一个$的时候，表示下载成功。

![20180418114231608][]

4.如何运行你下载的项目（下面演示前端运行的基本步骤--->具体情况具体分析！）。

一般在你下载的项目文件里会有README.md文件，里面会提供你启动项目的方法，但需要注意的是：

如果你没有安装node.js和npm的话，建议你先安装这个，这里我就不具体讲怎么安装了

下载下来的项目，需要进入这个项目文件夹，然后右键->Git Bash Here，安装依赖环境 :npm install   //安装完成之后，会在你的项目文件夹里看到node\_modules文件，然后按照README.md的提示启动就好啦~

以上内容，如有问题，欢迎指教！

更多的细节可以参考：[https://blog.csdn.net/qq\_37606901/article/details/108548377][https_blog.csdn.net_qq_37606901_article_details_108548377]

[20180330144818923]: /images/20220522/145f63db9f474113a8cbcca6e1a8e5dc.png
[20180330145000307]: /images/20220522/3e702b23b3144baebd16e732f250fe35.png
[20180330145311236]: /images/20220522/cd80a939b6f043968aa45f6b61fa715d.png
[20180330150516657]: /images/20220522/6aba38445c5d41879d9b148c5770f4a3.png
[20180330151428608]: /images/20220522/766997cc37624f64b7e3601917182075.png
[20180330151507848]: /images/20220522/059d4586148f4b9c9de2dbd899299bf8.png
[20180330152158826]: /images/20220522/0e5e546aa2994b2b97a54bb7b8e2e07e.png
[20180418114231608]: /images/20220522/31e986dfada54560b701ec63743f1cca.png
[https_blog.csdn.net_qq_37606901_article_details_108548377]: https://blog.csdn.net/qq_37606901/article/details/108548377