本文目的
一、创建一个能跑起来的空的vue项目
二、将该项目上传至github为后续代码进行管理
一、创建一个能跑起来的空的vue项目
1、前提:macbook
2、需要已经安装好
-
nodeJS
-
webpack
cnpm install webpack -g
- vue-cli
sudo npm install -g vue-cli(如下图)
- 淘宝镜像(可选)
npm install -g cnpm --registry=https://registry.npm.taobao.org
⭕️如果出现如图报错 因为mac没有给权限,记得加上sudo
3、正式安装
- 创建vue项目
- 切换到要放项目的文件夹,🌰我打算将项目放在documents里 cd 过去即可
- 输入下面指令 按照提示进行选择
vue init webpack 文件名
创建成功后,我们可以看见新创建的文件里面已经自动生成下面的文件
将项目拖拽到VSCode里面,打开终端,添加项目依赖,这里我选择的是cnpm指令,因为比较快速。也可以使用 npm install
cnpm i
可以看到文件夹里增加了依赖包 此刻项目已经配置结束 启动即可
启动项目指令
⚠️这句命令可以根据自己的习惯,在package.json里面自行更改
npm run dev
打开网址http://localhost:8080/#/
✅vue项目创建完毕,第一步完成。
二、将该项目上传至github为后续代码进行管理
github 这里不做再多介绍 进入github网站,这里命令都在项目文件夹下的终端完成。建议直接在vscode里面
1、安装git
brew install git
2、设置username和email
git config --global user.name "用户名"
git config --global user.email "当初注册的邮箱"
3、创建ssh key
ssh-keygen -t rsa -C "(邮箱)"
回车默认
cd .ssh
cat id_rsa.pub
将显示的密钥复制,打开github,进入setting,点击New SSH key
title随意填 然后将密钥复制在上面
✅完成本地配置
4、在github里面新建一个项目
对项目进行配置 输入仓库名称 点击确定即可
完成后按照提示的命令在终端输入即可。请完完整整的输入,如有报错,自行百度解决,但愿是顺利的~
输入到最后一条指令时,vscode会出提示,我们只需要跟着链接进去点击几下确认即可
我们的项目已经成功上传至github
这里我们看到只有一个md文件,下面使用git命令把我们创建的vue项目代码传上来
git add .
git commit -m 'update'
git push
大功告成^^撒花🎉
🎯因为本人配置过了密钥,所以密钥配置部分没有写太详细,相关截图没有提供。如果有小伙伴卡在这里,可以参考下面链接博文。
https://www.jianshu.com/p/6d8afc2315bc
千里之行 始于足下 项目开启了 那就 继续前进吧!