可视化面板快速搭建vue项目—前后端分离

前后端项目分离是现在比较常见的开发模式，本文重点介绍前端vue项目的初始化

• 安装vue脚手架
• 通过vue脚手架创建项目
• 配置vue路由
• 配置Element-UI组件库
• 配置axios库
• 初始化git远程仓库
• 本地项目托管到GitHub或者码云中

1、安装vue脚手架

官网下载地址：https://nodejs.org/zh-cn/

安装教程可参考：https://www.cnblogs.com/laizhouzhou/p/8027908.html

2、通过vue创建项目、配置vue路由

输入cmd打开终端窗口

在终端窗口中输入vue ui命令打开启动面板

进入桌面点击创建，选择你要存放项目的文件夹，点击创建即可

 进入预设面板，选择手动配置项目

选择要安装的配置

以上就是项目创建、路由配置全过程

3、安装配置Element-UI组件库 

打开仪表盘搜索Element-UI插件进行安装

插件安装完成还需要对插件进行配置

4、配置axios库 

点击依赖----安装依赖，搜索要添加的插件

注意这里是安装到-----运行依赖

5、初始化git远程仓库 、本地项目托管到GitHub或者码云中

全局配置，cmd进入终端执行Git全局设置

进入项目创建目录

执行：git add .    和git  commit -m “add files”把项目提交到本地

接下来就可以把项目提交到云端

 

 操作完成去刷新一下码云就可以看到项目已经托管到远程仓啦

6、查看项目是否搭建成功

进入仪表盘：任务--server--启动，访问http://localhost:8080/vue_shop/#/

到这里项目就搭建完成啦！！！