Vue项目实战
前端项目初始化步骤
① 安装vue脚手架
② 通过脚手架 创建项目
③ 配置 vue 路由
④ 配置 element—ui 组件库
⑤ 配置 axios 库
⑥ 初始化 git 远程仓库
⑦ 将本地项目托管到 github 或 码云上
创建项目
通过脚手架 创建项目 配置 vue 路由
可视化创建项目 桌面 wiin + R 输入 cmd 打开控制面板 然后输入 可视化指令：vue ui
运行完 直接跳转到可视化界面，选择创建项目的路径
点击下面的创建项目，项目完成可以保存预设 也可以不保存
项目创建完成
配置 element—ui 组件库
找到插件 右上角添加插件 搜索 vue-cli-plugin-element
选中 vue-cli-plugin-element 右下角 安装
配置 axios 库
找到依赖 右上角添加插件 搜索 axios
选中 axios 右下角 安装
创建远程仓库
进入到 码云 进行设置
添加公钥 教程
复制 ssh-keygen -t ed25519 -C "[email protected]" [email protected]只是生成的 sshkey 的名称，并不约束或要求具体命名为某个邮箱。 然后 cmd 运行 这个指令
生成第二个公钥：
1、`ssh-keygen -t ed25519 -C "[email protected]" -f ~/.ssh/second_rsa`
2、切换目录到~/.ssh，打开目录下的『config』文件（如果没有此文件，可以打开终端，输入touch config生成此文件），如下配置『config』文件（文件中不能出现备注）：
1 # CODING
2 Host git.coding.net #这里需要把网站改成你使用的网站，如：github.com
3 User [email protected]
4 PreferredAuthentications publickey
5 IdentityFile ~/.ssh/second_rsa
注意： 第五行的名称为上一步自定义名称
4、在终端输入 ssh-add ~/.ssh/id_rsa ~/.ssh/second_rsa
ssh-add ~/.ssh/id_rsa ~/.ssh/second_rsa
可能遇到的问题：，此时在终端输入：
ssh-agent bash
5、这样就添加成功啦
点击完成 弹出框 输入账号密码进行验证 然后 就可以看到自己创建的的公钥了
创建完成 测试 是否可用 终端 输入ssh -T [email protected]
首次使用需要确认并添加主机到本机SSH可信列表
初始化 git 远程仓库 将本地项目托管到 码云
创建生成 一个 下方类似的界面
首先执行 全局设置 指令
如果还没有创建项目库 可以用创建git仓库
已经有仓库 直接 运行 下方指令
复制全局设置指令 到 cmd 中 去运行
首先 输入
git status检查一下项目
如果 报错fatal: not a git repository (or any of the parent directories): .git先执行一下git init
如果 有些项目文件 需要处理 把文件添加到缓存区git add .
然后 本地提交git commit -m "add files"
在执行一遍git status检查一下项目
接下来创建一下远程的仓库 复制git remote add origin https://gitee.com*****/vue_shop.git
打开本地项目目录 运行cmd
在执行git push -u origin "master"
最后 到 gitee 上 刷新页面 看看 有没有提交的项目 就能发现有没有成功
配置项目启动完 自动达赖页面
在 vue.config.js 文件中 进行配置
const {
defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
// 启动完 项目 自动打开 浏览器
devServer: {
host: 'localhost',
open: true,
port: 8080
},
})