前端vue项目初始化步骤以及后台项目的环境安装配置

本文详细介绍了前端Vue项目从安装vue脚手架、创建项目、配置路由、Element-UI组件库、axios库,到初始化git仓库及托管到GitHub或码云的全过程。同时,还阐述了后台项目的环境安装配置,包括安装MySQL、node.js,配置项目信息,启动项目,并使用Postman测试接口的正确性。
摘要由CSDN通过智能技术生成

前端项目初始化步骤

1. 安装vue脚手架

先安装nodejs,配置环境,然后安装合适版本的vue-cli,这在学习vue基础时应该已经都安装好了

2. 通过vue脚手架创建项目
3. 配置vue路由

有两种方法,一种是直接在命令提示符里面操作,一种是在浏览器中可视化地创建vue项目

以管理员身份打开命令提示符后切换路径的方法

在电脑导航栏找到搜索,输入命令提示符,选择以管理员身份打开,输入d:去往D盘,输入cd 空格 +路径,比如:cd D:\前端学习路程\Vue

在这里插入图片描述

在这里插入图片描述

  • 方法一:

    直接输入命令vue create 文件名:vue create vue_test
    在这里插入图片描述

  • 方法二:

  1. 以管理员打开命令提示符并选择好文件路径,输入vue ui自动打开浏览器,记得不要关闭哦,不然浏览器会显示未连接导致无法操作,不小心关闭了的话,按照打开的顺序,重新打开一次就行
    在这里插入图片描述

  2. 开始创建项目,输入项目文件夹名,初始化git仓库,其他默认即可,点击下一步
    在这里插入图片描述

  3. 选择手动创建项目或者是自动创建

前两个选项是自动创建项目,自主选择Vue3或是Vue2

在这里插入图片描述

  1. 如果选择了手动创建,那么点击下一步会出现以下页面,默认选择了Babel和Linter/Formatter,需要自己选择打开Router,使用配置文件两个选项,点击下一步,弹幕中有人说不要下载ESlint,其实下载了也没有关系,可以在vue.config.js文件夹中使用lintOnSave:false, //关闭语法检查

在这里插入图片描述

  1. 选择2xESLint+Standard config,其他默认,点击创建项目,等待一会儿,项目创建成功

  • 1
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值