vue框架可以配合php做企业站,基于Vue和PHP打造前后端分离的通用管理系统（一）...

实用人群

适合小白入门，高手请绕行

技术栈

javascript vuejs webpack babel eslint nodejs axios

php mysql redis

git vagrant centos

整体思路

git负责版本控制，这个算是标配

前台: 使用vuejs框架，用javascript语言打造，UI使用ElementUI。webpack babel eslint nodejs 服务于javascript代码编写。

后台: 用PHP作，mysql数据库，redis缓存，运行在装有centos系统虚拟机中，通过vagrant管理虚拟机

return {

// 需要渲染的界面

view: {

// 界面名称

name: 'Table'

// 界面的配置信息

column: [

...

]

// ...

},

// 需要渲染的数据列表

rows: [

...

],

//提示信息

message: '...',

status: true

}

环境搭建

为方便新手入门，本文在windows环境下进行。软件统一安装到D:\Server目录下

1. 创建工作目录

在D盘创建Server目录，用于搭建工作环境

2. 安装git

在git首页下载相应位数(64/32)的Windows版git，

然后一路下一步安装，注意选择安装位置。

调出命令行(win+r输入cmd)输入 git --version 显示git版本号即可。

3. 安装Nodejs和Vue

在nodejs首页下载，一路next，注意选择安装位置。

命令行输入 node -v 显示node版本号。

命令行输入 npm --v 显示npm版本号即可。

在D:\Server\nodejs目录下下建立"node_global"及"node_cache"两个文件夹。然后命令行输入:

npm config set prefix "D:\Server\nodejs\node_global"

npm config set cache "D:\Server\nodejs\node_cache"

桌面/我的电脑/右键【属性】/高级系统设置/高级/环境变量

用户变量Path中 C:\...npm 替换为D:\Server\nodejs\node_global

系统变量增加NODE_PATH=D:\Server\nodejs\node_global

可以通过 npm config get prefix查看设置情况

输入npm install --global vue-cli测试一下(不改源，需要喝杯水的时间...)

正常的话，vue就安装完成了，下一步在浏览器插件商店中找到并安装vue-devtools

恭喜，前端环境搭建基本完成