基于Vue的电商后台管理系统（1）
基于Vue的电商管理系统  (1)
正好这段时间在做⼀个电商管理系统的项⽬，借此总结⼀下。该项⽬主要是⼀个电商的后台管理系统，可实现管理⽤户账号，即登录、退出、⽤户管理、权限管理等，商品管理，即商品分类、分类参数、商品信息，订单信息等以及数据统计。
前端项⽬是基于Vue的SPA项⽬，前端技术栈采⽤Vue+VueRouter+Element-UI+Axios+Echarts，后端技术栈采⽤
Node.js+Express+Jwt(模拟session)+Mysql+Sequelize组成。由于此项⽬主要练习相关前端技术栈，故后端采⽤已有模板进⾏搭建。后端不做详细介绍。
前端：
A.安装Vue脚⼿架
B.通过脚⼿架创建项⽬
C.配置路由
D.配置Element-UI：在插件中安装，搜索vue-cli-plugin-element
E.配置Axios：在依赖中安装，搜索axios(运⾏依赖)
F：初始化git远程仓库
G：将本地项⽬托管到GItHub或者码云中
后端项⽬的环境安装配置：
①安装 MySQL 数据库
②安装 Node.js 环境
③配置项⽬相关信息
④启动项⽬
vue element admin⑤使⽤ Postman 测试后台项⽬接⼝是否正常
项⽬初始化
安装Vue脚⼿架
1.安装3.x版本的Vue脚⼿架
npm install -g @vue/cli
使⽤vue -V命令检查是否安装成功
搭建Vue项⽬的三种⽅式：
// 1.基于交互式命令⾏的⽅式，创建新版vue项⽬
vue create my-project
//2.基于图形化界⾯的⽅式，创建新版 vue项⽬
vue ui
//3.基于 2.x的旧模板，创建旧版 vue项⽬
npm install -g @vue/cli-init
vue init webpack my-project
通过vue ui命令启动可视化窗⼝对Vue脚⼿架进⾏配置(需事先安装好Vue)，命令键⼊成功后，会⾃动弹出配置页⾯，选择⼿动配置，勾选Babel(将⾼级JS语法转换为低级语法)、Router(路由)、Linter(拼写检查)进⾏配置，选择标准配置，创建好项⽬后可能会需要⼀段时间的加载。
vue ui
安装依赖插件
点击右上⾓添加插件，搜索vue-cli-plugin-elemen，点击插件图标然后点击最下⽅安装按钮，安装成功点击下⽅完成安装。
预览初始页⾯
4.配置后台项⽬
A.安装phpStudy并导⼊mysql数据库数据

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。