实用人群
适合小白入门,高手请绕行
技术栈
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
恭喜,前端环境搭建基本完成