Vue项目环境搭建及git仓库新建

雨点打透心脏的1/2处 2022-03-17 12:43 850阅读 0赞

主要是git安装 vue在git上的项目搭建命令 简单总结下

1.node安装  2.git安装 3.码云项目管理 4.vue项目搭建 5.git和码云代码同步

# 1. 安装node.js #

链接：[https://nodejs.org/en/download/][https_nodejs.org_en_download]

直接傻瓜式安装即可。一直下一步下一步就好啦。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70][]

安装完成后，在命令行运行node–v和npm –v均可以查看版本号

安装node.js后 里面就包含了npm文件，打开cmd文件夹测试是否安装成功

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 1][]

# 2.安装git #

连接：[https://git-scm.com/][https_git-scm.com]

点击右侧下载你需要的git

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 2][]

git下载后存放一个位置，解压文件，安装git文件，傻瓜式安装一直下一步下一步，

不会安装的 可以找下博客，我会在另外一个博客 单独讲解git的安装

接下后启动对应的git bash文件，可以发送快捷方式到桌面

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 3][]

启动git命令的窗口  之后就可以在对应的文件下，启动git命令窗口了

# 3.码云-项目代码管理仓库 #

链接：[https://gitee.com/][https_gitee.com]

注册一个码云账号---然后登陆码云账号，进行创建项目

![20190224161226936.png][]

创建项目

![20190224161242610.png][]

选择私有的项目--创建仓库--进行仓库信息的填写

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 4][]

点击创建文件---就会生成对应的文件

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 5][]

安装后  点击设置--配置公钥  同步git可以上传代码到码云

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 6][]

怎么生成公钥--点击链接可以进行操作

[https://gitee.com/help/articles/4181\#article-header0][https_gitee.com_help_articles_4181_article-header0]

添加成功后，就可以使用SSH协议对仓库进行操作了

# 4.创建文件--下载码云的项目 #

点击你的项目文件--克隆下载--ssh格式--复制链接

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 7][]

复制网址后 通过git在你创建的文件夹里面下载这个项目（目前是空的项目--普通下载项目也是这样的）

启动git bash -

指令 git clone 复制的ssh网址 （粘贴上去 鼠标右键粘贴复制）

回车下载项目

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 8][]

如果你的文件夹是新创建的就是空的内容，只有两个文件 .cmd的

# 5.vue项目搭建 #

在刚才你下载的项目文件夹下启动 git  下载vue

通过 npm指令下载vue--只演示指令代码--安装此处不放图

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 9][]

安装后可以启动vue项目，localhost:8080

**这时候我们安装的vue 项目都在本地文件夹里面，并没有同步到码云仓库上**

# **6.git同步提交本地项目** #

1.指令  git status 显示你更改的项目

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 10][]

2. git add  .   提交项目

git add .

git commit -m "some str"

git push

监控工作区的状态树，使用它会把工作时的所有变化提交到暂存区，包括文件内容修改(modified)以及新文件(new)，但不包括被删除的文件

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 11][]

3. git commit -m "注释内容"然后使用git commit -m "str"命令将暂存区的代码提交到本地仓库，最后将本地仓库的代码推送到远程服务器端；

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 12][]

这时候执行的时候出现了问题 让我链接对应的 码云仓库，这时候按提示走就可以

3.重写指令

<table> 
 <tbody> 
  <tr> 
   <td> <pre> git config --global user.email "2848408135@qq.com"</pre> <p>&nbsp;</p> </td> 
  </tr> 
  <tr> 
   <td> <pre> git config --global user.name "smile"</pre> </td> 
  </tr> 
 </tbody> 
</table>

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 13][]

4. git push

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 14][]

代码提交到码云仓库

这时候创新仓库就可看到我们下载vue项目的列表信息，本地和仓库信息同步了

之后修改项目，操作项目，提交同步内容同上

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 15][]

简单总结下，需要的可以看下，后期有时间会继续更新

对于vue项目搭建因为比较简单，没有介绍，可以自行百度查询就好啦

有时间会个更新vue项目搭建安装步骤

[https_nodejs.org_en_download]: https://nodejs.org/en/download/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70]: /images/20220317/bd5a9a225eea44cc9d83de2949366148.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 1]: /images/20220317/844b0233157343679f845306b768338d.png
[https_git-scm.com]: https://git-scm.com/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 2]: /images/20220317/c29b2dc03a7048c68a65b9f3b9ff3056.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 3]: /images/20220317/b23df9a7159d4dc9bc08bd67b76631f3.png
[https_gitee.com]: https://gitee.com/
[20190224161226936.png]: /images/20220317/0f6b0e91eb6c40f3a8ce8d82e127d7ad.png
[20190224161242610.png]: /images/20220317/2da91e03c6e14b1cb6dbdc63705d3036.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 4]: /images/20220317/fb320bfb8dd644819cf5fc26415fd9f6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 5]: /images/20220317/37b3f51ec8794861851c16b64f04d198.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 6]: /images/20220317/585f3bfb9d8e40478fccf1ae6b5b0ae4.png
[https_gitee.com_help_articles_4181_article-header0]: https://gitee.com/help/articles/4181#article-header0
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 7]: /images/20220317/aab2d6af18fd4a40b02dadb11d322dde.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 8]: /images/20220317/43dc0f1712484e6a80db370313bb5c38.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 9]: /images/20220317/4f6b7214d1824833a008848efd5de5b0.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 10]: /images/20220317/afcd303871fa4a1fa22bdc90d455b19e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 11]: /images/20220317/4d487e0d9ae343eab80ea873342e9d11.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 12]: /images/20220317/ea51dc6329304af1ae0833530a3dc02e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 13]: /images/20220317/2854a500c3624041981b65fcdf21b53f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 14]: /images/20220317/9616e7985f1f44459ab2eb1eb31afc25.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 15]: /images/20220317/ecd8a2d289e64e57a7468ee102704cd4.png